.main{ line-height: 30px; padding: 5% 0;} @media screen and (max-width:1400px){ .main{ padding-top: 15%;} } .img-cover-4by3{ width: 100%; height: 0; padding-bottom: 50%; position: relative; overflow: hidden;} .abs-center{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;} .shuiyin{ position: absolute; background: url("/static/index/zm001/images/shuiyin.png") no-repeat center top; width: 100%; height: 100%; background-size: 100% 100%;} #dituContent label { max-width: unset!important; text-align: center; } /*头部*/ #top_bj{ width: 100%; height: auto; transition:0.5s; background: #fff; position: fixed; z-index: 12; box-shadow: 0 0 10px rgba(0,0,0,0.3);} #top_index{ height: auto; margin: 0 auto;} #logo{ padding-top: 1%; padding-bottom: 1%; text-align: center; position: relative;} #logo img{ display: inline-block; max-width: 100%; transition:0.5s; position: relative; z-index: 1; } #logo:before{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; background: #0063d0;} #top_tel{ color: #0063d0; transition:0.5s;} #top_tel .top_tel_con{ position: relative; z-index: 1; padding: 6% 0 0 5%; } #top_tel .top_tel_con i{ font-size: 35px; float: left;} #top_tel .top_tel_con .left{ float: left; width: 80%; padding-left: 3%; font-size: 14px; line-height: 25px;} #top_tel .top_tel_con span{ font-size: 28px; font-family: Impact;} @media screen and (max-width:1400px){ #top_tel .top_tel_con span{ font-size: 26px;} } @media screen and (max-width:768px){ #top_index{ padding: 0; width: 100%;} #logo{ padding: 2% 0 2% 6%; text-align: left;} #logo:before{ width: 60%;} } #nav{ height: auto; transition:0.3s; padding-top: 1.5%;} #nav li{ float: left; width: 14%; height: 50px; line-height: 50px; font-size: 16px; font-weight: normal; color: #282828; text-align: center; transition:0.5s;} #nav li a{ display: inline-block; position: relative; z-index: 1; color: #282828;} #nav li:hover a{ color: #0b3e97;} #nav li a:after { content: ''; width: 100%; height: 3px; position: absolute; left: 0; bottom: 0; background-color: #0063d0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; left: 0; } #nav li:hover a::after { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: right; -moz-transform-origin: right; -ms-transform-origin: right; -o-transform-origin: right; transform-origin: right; right: 0; } @media (min-width: 1200px) and (max-width: 1440px){ #nav li{ font-size: 15px;} } @media (min-width: 768px) and (max-width: 1200px){ #nav{ margin-top: 0;} #nav li{ font-size: 15px;} } #ssbj{ border-bottom: 1px solid #eaeaea; height: 70px;} #ssbj .rmss{ line-height: 70px; color: #777777;} #ssbj .rmss a{ padding: 0 2%; color: #777777;} #ssbj .rmss span{ color: #1655bc;} .zy_search_form{ width: 100%; height: 40px; line-height: 40px; border: 1px solid #eaeaea; float: right;} .zy_search_form #search_name{ width: 80%; height: 38px; line-height: 38px; background: url("/static/index/zm001/images/ss.png") no-repeat 10px center; float: left; outline: none; color: #676767; font-size: 13px; text-indent: 50px;} .zy_search_form #button{ width: 20%; height: 38px; line-height: 38px; color: #fff; background: #0063d0; float: right; cursor: pointer; border:none; outline: none; transition: 0.3s;} @media screen and (max-width:768px){ .zy_search_form{ width: 100%; margin-top: 4%; float: none;} } #banner img{ width: 100%;} #banner .swiper-pagination{ bottom: 5%;} #banner .swiper-pagination-bullet{ width: 12px; height: 12px; transition:0.3s;} #banner .swiper-pagination-bullet-active{ width: 50px; border-radius: 8px;} #banner .swiper-button-next:after,#banner .swiper-button-prev:after{ display: none;} #banner .swiper-button-next i,#banner .swiper-button-prev i{ color: #fff; font-size: 50px;} #banner .swiper-button-next,#banner .swiper-button-prev{ background: rgba(0,0,0,0.2); width: 50px; height: 80px;} #banner .swiper-button-next{ right: 5%;} #banner .swiper-button-prev{ left:5%; } #slideBox1{ position:relative; overflow:hidden; margin:0 auto; width:100%;/* 设置焦点图最大宽度 */ } #slideBox1 .hd{ position:absolute; height:28px; line-height:28px; bottom:0; right:0; z-index:1; } #slideBox1 .hd li{ display:inline-block; width:5px; height:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background:#333; text-indent:-9999px; overflow:hidden; margin:0 6px; } #slideBox1 .hd li.on{ background:#fff; } #slideBox1 .bd{ position:relative; z-index:0; } #slideBox1 .bd li{ position:relative; text-align:center; height:auto; overflow:hidden; } #slideBox1 .bd li img{ vertical-align:top; width:100%;/* 图片宽度100% ，抵达自顺应效果 */} #slideBox1 .bd li a{ -webkit-tap-highlight-color:rgba(0,0,0,0); } /* 去掉链接触摸高亮 */ #slideBox1 .bd li .tit{ display:block; width:100%; position:absolute; bottom:0; text-indent:10px; height:28px; line-height:28px; color:#fff; text-align:left; } /*底部*/ #end_nr_bj{ background: url("/static/index/zm001/images/end_bj.jpg") repeat center top; width: 100%; height: auto; overflow: hidden; color: #7c7c7c;} #end_nr_bj a{ color: #7c7c7c; transition: 0.3s; position: relative;} #end_nr_bj a:hover{ color: #fff;} #end_nr_bj a:after{z-index:1;content: ''; position: absolute; left: 0; bottom: 0; display: block; height:5px; background-color: rgba(255, 255, 255, .3);width:100%; -webkit-transition: transform .5s; -moz-transition: transform .5s; -ms-transition: transform .5s; -o-transition: transform .5s; transition: transform .5s; -webkit-transform: scaleX(0); transform: scaleX(0);-webkit-transform-origin: right center;transform-origin: right center;} #end_nr_bj a:hover::after{ -webkit-transform-origin: left center;transform-origin: left center; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1);} #end_nr_bj .main{ padding: 2% 0;} #end_nr_bj .main .end_con ul{ border-right: 1px solid rgba(255,255,255,0.1);} #end_nr_bj .main .tit{ font-size: 16px !important; color: #fff; font-weight: bold; position: relative; height: 40px;} #end_nr_bj .main .tit:before{ position: absolute; left: 0; bottom: 0; content: ''; height: 2px; background: #fff; width: 30px; transition:0.3s;} #end_nr_bj .main .tit:hover:before{ width: 60px;} #end_nr_bj .main .end_con ul li{ line-height: 30px; transition:0.3s;} #end_nr_bj .main .end_con .lxwm{ color: #fff;} #end_nr_bj .main .pic .end_tel{ color: #7c7c7c;} #end_nr_bj .main .pic .end_tel span{ display: block; color: #fff; font-size: 30px; font-family: Impact;} #end_nr_bj .main .pic img{ max-width: 100%; display: inline-block;} @media screen and (max-width:1400px){ #end_nr_bj .main .left ul{ padding: 0 3%;} } @media screen and (max-width:768px){ #end_nr_bj .main{ padding: 5% 0;} #end_nr_bj .main .end_con .lxwm{ padding: 0 5%;} #end_nr_bj .main .pic{ text-align: center;} } #end_line{ height: auto; line-height: 30px; color: #6e6e6e; font-size: 14px; border-top: 1px dashed rgba(255,255,255,0.2);} .footer_zx{ height:60px; overflow: hidden; right:0; bottom:0; z-index: 20; width:100%; line-height: 25px; position: fixed; background-color:#e50113;} .footer_zx a{ color:#fff !important; display: block; width: 50%; height: 100%; float: left; text-align: center; background-color:#0063d0;} .footer_zx a:last-of-type{ background: #444444;} .footer_zx i{ font-size: 28px; padding: 4% 0 1%; font-weight: normal;} .footer_zx p{font-size: 13px;} .kb50{ height: 60px;} /*首页*/ .tit_in h1{ color: #282828;} .tit_in h1 span{ color: #0063d0;} .tit_in h5{ color: #666666; line-height: 40px;} .tit_in:before{ position: absolute; width: 6%; left: 47%; height: 3px; background: #1655bc; bottom: 0; content: '';} #huanjing{ margin-top: 3%;} #huanjing .swiper-container { width: 100%; height: auto; margin-left: auto; margin-right: auto;} #huanjing .swiper-slide { background-size: cover; background-position: center; position: relative;} #huanjing .gallery-top { background: #f7f7f7; height: auto; width: 100%; margin: 4% 0;} #huanjing .gallery-top .swiper-slide .font{ padding: 3%; position: relative;} #huanjing .gallery-top .swiper-slide .font .hot{ position: absolute; right: 10%; top: 0; z-index: 1; text-align: center; color: #fff; line-height: 55px; background: url("/static/index/zm001/images/hot.png") no-repeat center top; width: 46px; height: 69px;} #huanjing .gallery-top .swiper-slide .font .tit{ position: relative;} #huanjing .gallery-top .swiper-slide .font .tit p{ color: #282828; font-size: 20px;} #huanjing .gallery-top .swiper-slide .font .tit span{ display: block; color: #bababa; font-size: 14px; text-transform: uppercase;} #huanjing .gallery-top .swiper-slide .font .tit:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 8%; height: 3px; background: #0063d0; transition: 0.5s;} #huanjing .gallery-top .swiper-slide .font .tit:after{ position: absolute; left: 0; bottom: -10px; content: ''; width: 5%; height: 3px; background: #0063d0; transition: 0.3s;} #huanjing .gallery-top .swiper-slide .font .content{ color: #666666; font-size: 16px;} #huanjing .gallery-top .swiper-slide .font dl{ padding-left: 15px;} #huanjing .gallery-top .swiper-slide .font dl dt{ background: #0063d0; color: #fff; font-weight: normal; height: 45px; line-height: 45px; cursor: pointer; text-align: center; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1); position: relative;} #huanjing .gallery-top .swiper-slide .font dl dt a{ position: relative; z-index: 1; color: #fff !important;} #huanjing .gallery-top .swiper-slide .font dl dt:after{position: absolute; width: 100%; height: 0; content: ''; background-color: #fe731e; left: 0; bottom: 0; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);} #huanjing .gallery-top .swiper-slide .font dl dt:hover:after { height: 100%;width: 100%;} #huanjing .gallery-top .swiper-slide .font dl dt:hover{ letter-spacing: 3px;} #huanjing .gallery-top .swiper-slide:hover .font .tit:before{ width: 12%;} #huanjing .gallery-top .swiper-slide:hover .font .tit:after{ width: 6%;} #huanjing .gallery-thumbs { height: auto; text-align: left; box-sizing: border-box;} #huanjing .gallery-thumbs .swiper-slide { cursor: pointer; padding: 2% 0; transition:0.3s;} #huanjing .gallery-thumbs .swiper-slide .tit{ color: #666666; font-size: 18px; transition: 0.3s;} #huanjing .gallery-thumbs .swiper-slide .num{ text-transform: uppercase; color: #e0e0e0; transition: 0.3s;} #huanjing .gallery-thumbs .swiper-slide .num p{ float: left; position: relative; height: 40px; font-family: Impact; font-size: 24px;} #huanjing .gallery-thumbs .swiper-slide .num p:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 30%; height: 2px; background: #e0e0e0;} #huanjing .gallery-thumbs .swiper-slide .num i{ float: left; margin-left: 20%; font-size: 20px; transition: 0.3s;} #huanjing .gallery-thumbs .swiper-slide:hover .num,#huanjing .gallery-thumbs .swiper-slide:hover .tit{ color: #0063d0; } #huanjing .gallery-thumbs .swiper-slide:hover .num p:before{ background: #0063d0;} #huanjing .gallery-thumbs .swiper-slide:hover .num i{ color: #ff6101;} #huanjing .gallery-thumbs .swiper-slide-thumb-active .num,#huanjing .gallery-thumbs .swiper-slide-thumb-active .tit{ color: #0063d0; } #huanjing .gallery-thumbs .swiper-slide-thumb-active .num i{color: #ff6101;} #huanjing .gallery-thumbs .swiper-slide-thumb-active .num p:before{ background: #0063d0;} @media screen and (max-width:1200px){ #huanjing .gallery-top .swiper-slide .font{ padding: 0;} #huanjing .gallery-top .swiper-slide .font .content{ font-size: 14px;} } @media screen and (max-width:768px){ #huanjing .gallery-top .swiper-slide .font{ padding: 0 30px;} } #cpgd_in{ position: relative;} #cpgd_in .swiper-container { width: 100%; height: 100%; padding: 2% 0 0; } #cpgd_in .swiper-slide { text-align: center; overflow: hidden; transition: 0.3s; position: relative; /* Center slide text vertically */ flex-direction: column; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #cpgd_in .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 100%; position: relative; overflow: hidden;} #cpgd_in .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } #cpgd_in .swiper-slide .content{ position: absolute; left: 100%; top:100%; z-index: 1; width: 100%; height: 100%; background: rgba(0,0,0,0.5); transition:0.4s;} #cpgd_in .swiper-slide .content .cp_logo{ padding-top: 20%;} #cpgd_in .swiper-slide .content .cp_logo img{ max-width: 55%;} #cpgd_in .swiper-slide .content .tit{ color: #fff; padding: 15% 0 5%; font-size: 20px;} #cpgd_in .swiper-slide:hover .content{ left: 0; top: 0;} .cp-tools { text-align: center; padding: 0 10%; overflow: hidden;} .cp-tools a { display: block; float: left; flex: 1; width: 48%; height: 40px; line-height: 40px; background-color: #0063d0; color: #ffffff; transition: 0.3s; } .cp-tools a:nth-of-type(2){ float: right;} .cp-tools a.btn-free { background:none; color: #fff; border:1px solid #fff;} .cp-tools a:hover { background-color: #0063d0; border:1px solid #0063d0; color: #ffffff; } .cp-tools a:hover ~ .btn-ask { background:none; color: #fff; border:1px solid #fff; } @media screen and (max-width:768px){ #cpgd_in .swiper-slide .content .cp_logo img{ max-width: 80%;} #cpgd_in .swiper-slide .content .tit{ font-size: 14px; padding: 5% 0;} .cp-tools{ padding: 0 5%;} .cp-tools a{ height: 30px; line-height: 30px; font-size: 12px;} } #ysbj{ background: url("/static/index/zm001/images/ysbj.jpg") no-repeat center top fixed;} #ysbj .tit_in h1,#ysbj .tit_in h5{ color: #fff;} #ysbj .tit_in:before{ background: #fff;} .index-all-pro{ height: auto;; overflow: hidden; text-align: center;} .index-all-pro li{ float: left; width: 25%; overflow: hidden; height: 600px; position: relative; transition: all 0.5s; padding: 0; } .index-all-pro li .pic{width: 100%; height: 100%; position: relative; overflow: hidden;} .index-all-pro li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } .index-all-pro li .content{ transition: 0.5s cubic-bezier(0.645, 0.045, 0.355, 1); font-size: 18px; z-index: 9; bottom: 0; left:0; position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.7); text-align: center; color: #fff; padding-top: 40%;} .index-all-pro li .content .tit i{ font-size: 45px;} .index-all-pro li .content .tit p{ font-size: 24px; padding-top: 8%;} .index-all-pro li .content .fdj{ padding-top: 10%; transition: 0.3s;} .index-all-pro li .content .fdj i{ font-size: 30px;} .index-all-pro li .content .nr{ opacity: 0; font-size: 14px; padding: 8% 5%; transition:0.3s;} .index-all-pro li .content .more{ opacity: 0; display: inline-block !important; height: 50px; line-height: 50px; background: #ff6101; width: 30%; border-radius: 5px; transition:0.3s; color: #fff;} .index-all-pro li img{ width: 100%; transition: all 2.5s } .index-all-pro li:hover img{ transform: scale(1.1); } .index-all-pro li:hover .content{ display: block; height: 70%; width: 70%; bottom: 15%; left: 15%; padding-top: 10%; background: rgba(0,99,208,0.7);} .index-all-pro li:hover .content .more{ width: 40%;} .index-all-pro li:hover .fdj{ opacity: 0; display: none;} .index-all-pro li:hover .content .nr,.index-all-pro li:hover .content .more{ opacity: 1;} .index-all-pro li:hover{box-shadow: 3px 11px 20px -15px #5e6263;} .index-all-pro .youshi_li{ width: 22%;} .index-all-pro .youshi_li_active{ width: 34%;} @media screen and (max-width:1440px){ .index-all-pro li{ height: 500px;} .index-all-pro li .content{ padding-top: 45%;} .index-all-pro li .content .more{ display: none !important;} } @media screen and (max-width:1200px){ .index-all-pro li{ height: 350px;} .index-all-pro li .content .tit i{ font-size: 30px;} .index-all-pro li .content .tit p{ font-size: 20px;} .index-all-pro li .content .tit span{ font-size: 14px;} .index-all-pro li .content .nr{ line-height: 25px; font-size: 12px;} .index-all-pro li:hover .content{ padding-top: 5%;} } @media screen and (max-width:768px){ .index-all-pro li{ width: 50%;} .index-all-pro li .content{ padding-top: 25%;} .index-all-pro li .content .tit i{ font-size: 30px;} .index-all-pro li .content .tit p{ font-size: 20px;} .index-all-pro .youshi_li{ width: 50%;} .index-all-pro .youshi_li_active{ width: 50%;} } @media screen and (max-width:765px){ .index-all-pro li{ height: 250px;} .index-all-pro li:hover .content{ height: 90%; width: 90%; bottom: 5%; left: 5%;} .index-all-pro li .content .tit i{ font-size: 30px;} .index-all-pro li .content .tit p{ font-size: 16px;} .index-all-pro li .content .nr{ font-size: 12px; line-height: 20px; padding: 5%;} } #ysmore{ display: block; position: relative; margin: 0 auto; height: 40px; line-height: 40px; color: #fff; width: 200px; background: #ff6101; text-align: center;} #ysmore p{ position: relative; z-index: 1;} #ysmore:after{position: absolute; width: 100%; height: 0; content: ''; background-color: #333; left: 0; bottom: 0; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);} #ysmore:hover:after { height: 100%;width: 100%;} #youshi{ position: relative;} #youshi .swiper-container { width: 100%; height: auto; margin-left: auto; margin-right: auto;} #youshi .swiper-slide { background: #f6f6f6; background-size: cover; background-position: center;} #youshi .gallery-top { height: auto; width: 100%; padding: 3% 0 1%;} #youshi .gallery-top .pic{ width: 100%; height: 0; padding-bottom: 50%; position: relative; overflow: hidden;} #youshi .gallery-top .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } #youshi .gallery-top .font{ background: #0063d0; color: #fff; position: absolute; right: 5%; top: -3%; border-radius: 5px; width: 30%; padding: 8% 3%; box-shadow: 0 0 10px rgba(0,0,0,0.5);} #youshi .gallery-top .font .tit{ font-size: 24px; font-weight: bold; padding-bottom: 20px;} #youshi .gallery-top .font .content{ color: #fff; font-size: 14px; padding: 7% 0 !important;} #youshi .gallery-top .font .more{ position: relative; background: #ff6101; height: 50px; line-height: 50px; width: 70%; text-align: center; margin: 5% auto; color: #fff;} #youshi .gallery-top .font .more p{ position: relative; z-index: 1;} #youshi .gallery-top .font .more:after{position: absolute; width: 100%; height: 0; content: ''; background-color: #333; left: 0; bottom: 0; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);} #youshi .gallery-top .font .more:hover:after { height: 100%;width: 100%;} #youshi .gallery-thumbs { height: 20%; box-sizing: border-box; padding: 15px 0 0;} #youshi .gallery-thumbs .swiper-slide { background: #f7f7f7; color: #1e1e1e; cursor: pointer; border: 1px solid #d8d8d8;} #youshi .gallery-thumbs .swiper-slide .tit{ line-height: 50px; text-align: center;} #youshi .gallery-thumbs .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;} #youshi .gallery-thumbs .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;} #youshi .gallery-thumbs .swiper-slide-thumb-active { background: #0063d0;} #youshi .gallery-thumbs .swiper-slide-thumb-active .tit{ color: #fff;} @media screen and (max-width:1200px){ #youshi .gallery-thumbs{ position: relative; background: #f6f6f6;} #youshi .gallery-top{ margin-bottom: 10px;} #youshi .gallery-top .font{ width: 40%; } #youshi .gallery-top .font .tit{ font-size: 22px; padding-bottom: 0;} #youshi .gallery-top .font .content{ padding: 3% 0 !important; font-size: 12px;} #youshi .gallery-top .font .nr{ font-size: 16px;} #youshi .gallery-top .font .more{ height: 40px; line-height: 40px; margin-bottom: 5%;} } @media screen and (max-width:768px){ #youshi .gallery-thumbs{ position: relative; background: #f6f6f6;} #youshi .gallery-top{ margin-bottom: 10px;} #youshi .gallery-top .font{ position: relative; width: 100%; right: 0; top: 0; box-shadow: none; padding: 5% 3% 1%;} #youshi .gallery-top .font .tit{ font-size: 22px; padding-bottom: 0;} #youshi .gallery-top .font .content{ padding: 3% 0 !important; font-size: 12px;} } #gsjjbj{ background: url("/static/index/zm001/images/gsjj_bj.jpg") repeat-y right top #073261; position: relative;} #gsjjbj:before{ position: absolute; right: 50px; top: 0; content: 'ABOUT US'; writing-mode: vertical-rl; color: rgba(255,255,255,0.1); font-size: 150px; } #gsjj_pic{ width: 100%; height: 0; padding: 0 0 40%; position: relative; overflow: hidden; } #gsjj_pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;} #gsjj{ color: #fff; padding: 5% 3%;} #gsjj .tit p{ font-size: 30px;} #gsjj .tit span{ display: block; color: #666666; font-family: Arial; font-size: 14px; text-transform: uppercase; position: relative; padding-left: 35px;} #gsjj .tit span:before{ position: absolute; left: 0; top: 50%; height: 3px; width: 25px; background: #ff6101; content: '';} #gsjj .content{ font-size: 16px; line-height: 40px;} #gsjj .more{ height: 40px; background: #ff6101; line-height: 40px; width: 25%; text-align: center; position: relative;} #gsjj .more a{ display: inline-block; position: relative; z-index: 1; color: #fff;} #gsjj .more:after{position: absolute; width: 100%; height: 0; content: ''; background-color: #0063d0; left: 0; bottom: 0; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);} #gsjj .more:hover:after { height: 100%;width: 100%;} #gsjj_ys{ position: absolute; bottom: 7%; left: 0; z-index: 1; width: 100%;} #gsjj_ys_con{ background: #fff; padding: 2% 0;} .jjys_lb{ text-align: center; position: relative; padding: 0;} .jjys_lb:before{ position: absolute; right: 0; top: 20%; content: ''; width: 1px; height: 60%; background: #d9d9d9;} .jjys_lb p{ color: #0063d0; font-size: 40px; padding-bottom: 5%;} .jjys_lb span{ display: block; color: #666666; font-size: 16px;} .jjys_lb:last-of-type:before{ display: none;} @media screen and (max-width:768px){ #gsjj_ys{ position: relative; bottom: 10px;} .jjys_lb p{ font-size: 20px;} .jjys_lb span{ font-size: 12px;} } #xwdt .tit_font{ text-align: left; font-size:18px; color: #666666; margin-top: 15%;} #xwdt .in_tit{ text-align: left; margin: 0 auto; line-height: 45px;} #xwdt .in_tit h4{ font-size: 36px; color: #282828; margin: 0;} #xwdt .in_tit span{ display: block; color: #666666; font-size: 24px; text-transform: uppercase; position: relative; padding-bottom: 10px;} #xwdt .in_tit p{ color: #666666; font-size: 16px; margin-top: 5px;} #xwdt .more{ position: relative; clear: both; width: 160px; height: 38px; text-align: center; line-height: 38px; color: #fff; transition:0.3s; cursor: pointer; float: left; margin-top: 150px; background: #ff6101;} #xwdt .more i{ display: inline-block; font-size: 20px; margin-left: 10px;} /*#xwdt .more:hover{ background: #0063d0; color: #fff; letter-spacing: 3px;}*/ #xwdt .more p{ position: relative; z-index: 1;} #xwdt .more:after{position: absolute; width: 100%; height: 0; content: ''; background-color: #0063d0; left: 0; bottom: 0; transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);} #xwdt .more:hover:after { height: 100%;width: 100%;} #xwdt{ position: relative;} #xwdt .swiper-button-prev:after,#xwdt .swiper-button-next:after{ display: none;} #xwdt .swiper-button-prev{ position: absolute; left: 0;} #xwdt .swiper-button-prev:before{ position: absolute; content: ''; right: 0; top: 15%; width: 1px; height: 70%; background: #0063d0;} #xwdt .swiper-button-next{ position: absolute; left: 50px; right:auto;} #xwdt .swiper-button-prev,#xwdt .swiper-button-next{ height: 38px; width: 50px; outline: none; top: 40%;} #xwdt .swiper-button-prev i,#xwdt .swiper-button-next i{ font-size: 35px; color: #0063d0; transition: 0.3s;} #xwdt .swiper-button-prev:hover i,#xwdt .swiper-button-next:hover i{ font-weight: bold; color: #ff6101;} #xwdt .swiper-container { width: 100%; height: 100%; overflow: hidden; } #xwdt .swiper-slide { flex-direction: column; text-align: left; height: auto; padding: 0; overflow: hidden; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #xwdt .swiper-slide .p25{ padding: 0;} #xwdt .swiper-slide span{ display: block; width:100%;} #xwdt .swiper-slide .time{ color: #e0e0e0; font-size: 30px; text-align: left; transition: 0.3s; font-family: Impact;} #xwdt .swiper-slide .tit{ font-size: 16px; line-height: 25px; padding-top: 8%; transition: 0.3s;} #xwdt .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 75%; position: relative; overflow: hidden; margin: 8% 0;} #xwdt .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: 0.3s;} #xwdt .swiper-slide .font{ color: #666666; font-size: 14px; line-height: 25px;} #xwdt .swiper-slide i{font-size: 50px; margin-top: 30px; color: #bdbdbd; transition: 0.3s;} #xwdt .swiper-slide:hover .time,#xwdt .swiper-slide:hover i{ color: #0063d0;} #xwdt .swiper-slide:hover .date,#xwdt .swiper-slide:hover .tit a{ color: #0063d0;} #xwdt .swiper-slide:hover i{ font-size: 60px;} #xwdt .swiper-slide:hover .pic img{ transform: scale(1.1);} @media screen and (max-width:768px){ #xwdt .in_tit h4{ font-size: 30px;} #xwdt .in_tit span{ font-size: 16px;} #xwdt .in_tit{ line-height: 25px;} #xwdt .swiper-container{ margin-top: 3%;} #xwdt .swiper-slide .time{ font-size: 24px;} } /*金狮贵宾会简介*/ #zi_banner{ width: 100%; height: auto; position: relative;} .sub_banner { overflow: hidden; position: relative; -webkit-transition: all .5s; } .sub_banner .s { width: 100%; height: auto; position: relative; } .sub_banner img { opacity: 0; visibility: hidden; filter:contrast(2.5) brightness(2.5); -webkit-transition: all 1s; -webkit-transform: scale(1.05); } .sub_banner.active img { filter: contrast(1) brightness(1); opacity: 1; visibility: visible; -webkit-transform: scale(1); } #home{ height: auto; position: absolute; bottom: -40px; left: 0; z-index: 2; width: 100%; } #home .container{ background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); height: 80px; line-height: 80px;} #home li{ text-align: center; cursor: pointer; font-size: 15px;} #home li a{ display: inline-block; position: relative; color: #666666;} #home li:hover a{ color: #0063d0;} #home li a:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 0; height: 2px; background: #0063d0; transition:0.3s;} #home li:hover a:before{ width: 100%;} #home li#li-on a{ color: #0063d0 !important;} #home li#li-on a:before{ width: 100%;} @media screen and (max-width:1200px){ #home li a{ font-size: 12px;} .sub_banner.active img{ width: 250%;} #home .cpclass{ padding-top: 10px;} #home .cpclass li{ line-height: 30px;} } .homr_con{ text-align: right;} .homr_con a{ color: #666666; padding: 0 5px;} .homr_con i{ display: inline; color: #666; font-size: 20px; margin-right: 5px;} .cpclass li{ padding: 0 2%;} .jj_tit h1{ color: #9c9c9c; font-size: 36px; font-weight: bold !important; text-transform: uppercase;} .jj_tit h3 { padding-top: 10px; color: #373737;} @media screen and (max-width:1200px){ .jj_tit h1{ font-size: 24px;} .jj_tit{ padding-top: 5%;} } .jj_content .float-left{ color: #747474; font-size: 16px; line-height: 40px;} .jj_content .float-right{ width: 100%; height: 0; padding-bottom: 30%; position: relative; overflow: hidden;} .jj_content .float-right img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } #qywhbj{ background: url("/static/index/zm001/images/qywh.jpg") no-repeat center top;} .wh-box{ width: 100%; background: #fff; height:100%; position: relative; transition: all 0.5s; margin: 0 20px;} .wh-box:after{ position: absolute; content: ""; width: 100%;height: 4px; background: #ff6101; left: 0; bottom: 0px; transition: all 0.5s; right: 0; transition: transform 0.5s; margin: auto; transform-origin: right center; transform: scaleX(0)} .wh-box:hover:after{ transform-origin: left center; transform: scaleX(1);} .wh-box:hover{ -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); -webkit-box-shadow: 0 0 20px rgba(51, 51, 51, 0.1); -moz-box-shadow: 0 0 20px rgba(51, 51, 51, 0.1); box-shadow: 0 0 20px rgba(51, 51, 51, 0.1); } .wh-box span{ background: #004da2; height: 100px; width: 100px; line-height: 100px; text-align: center; border-radius: 100%; display: block; margin: 0 auto; transition: 0.3s;} .wh-box span i{ color: #fff; font-size: 45px;} .wh-box p:nth-of-type(1){ color: #282828; font-size: 24px;} .wh-box p:nth-of-type(2){ color: #999999; font-size: 24px; position: relative; font-size: 14px; text-transform: uppercase} .wh-box p:nth-of-type(2):after{ position: absolute; content: "";left: 0; bottom: -80%; right: 0; margin:auto; background: #ff6101; width:8%; height: 2px; transition:transform 0.5s; display: block ;} .wh-box p:nth-of-type(n+3){ color: #666666; font-size: 18px; line-height: 20px; margin-top: 4% !important;} .wh-box:hover p:nth-of-type(2):after{width:5%; transform:rotate(90deg);} .wh-box:hover span{ background: #ff6101;} @media(max-width: 768px) { #qywhbj{background: url("/static/index/zm001/images/qywh.jpg") repeat-y center top;} .wh-box { background: #fff; height: 100%; width: 100%; position: relative; transition: all 0.5s; margin: 0 0 3%; } .wh-box span { background: #1b3d85; height: 100px; width: 100px; line-height: 100px; border-radius: 100%; display: block; position: relative; margin: 0 auto } .wh-box p:nth-of-type(1) { color: #282828; font-size: 20px; } .wh-box p:nth-of-type(2) { color: #999999; font-size: 16px; position: relative; font-size: 14px; text-transform: uppercase } .wh-box p:nth-of-type(2):after { position: absolute; content: ""; left: 0; bottom: -60%; right: 0; margin: auto; background: #ff6101; width: 8%; height: 2px; transition: transform 0.5s; display: block; } .wh-box p:nth-of-type(n+3) { color: #666666; font-size: 14px; line-height: 20px; } .wh-box:hover p:nth-of-type(2):after { width: 5%; transform: rotate(90deg); } } #gshj{ position: relative;} #gshj .swiper-container { width: 100%; height: 100%; padding: 3% 0 5%; } #gshj .swiper-slide { text-align: center; overflow: hidden; transition: 0.3s; /* Center slide text vertically */ flex-direction: column; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #gshj .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 75%; position: relative; overflow: hidden;} #gshj .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } #gshj .swiper-slide p{ width: 100%; height: 50px; line-height: 50px; background: #f2f2f2; transition:0.3s; } #gshj .swiper-slide:hover .pic img{ transform: scale(1.1);} #gshj .swiper-slide:hover p{ background: #024f93; color: #fff; } #gshj .swiper-button-next,#gshj .swiper-button-prev{ background: #0063d0; width: 45px; height: 45px; line-height: 45px; top: 48%;} #gshj .swiper-button-next:after,#gshj .swiper-button-prev:after{ display: none;} #gshj .swiper-button-next i,#gshj .swiper-button-prev i{ font-size: 40px; color: #fff; transition: 0.3s;} #gshj .swiper-button-next{ right: -2%;} #gshj .swiper-button-prev{ left: -2%;} #gshj .swiper-button-next:hover,#gshj .swiper-button-prev:hover{ background: #333;} @media screen and (max-width:768px){ #gshj .swiper-container{ padding: 3% 5%;} #gshj .swiper-button-next{ right:0;} #gshj .swiper-button-prev{ left:0;} #gshj .swiper-button-next,#gshj .swiper-button-prev{ width: 30px;} #gshj .swiper-button-next i,#gshj .swiper-button-prev i{ font-size: 30px;} } #zzrybj{ background: url("/static/index/zm001/images/rybj.jpg") no-repeat center bottom;} #zzry{ position: relative;} #zzry .swiper-container { width: 100%; height: 100%; padding: 3% 0 5%; } #zzry .swiper-slide { text-align: center; overflow: hidden; transition: 0.3s; /* Center slide text vertically */ flex-direction: column; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } #zzry .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 75%; position: relative; overflow: hidden;} #zzry .swiper-slide .pic p{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; background: #fff;} #zzry .swiper-slide .pic p img{ max-width: 100%; height: 100%; transition:0.3s; } #zzry .swiper-slide span{ display: block; width: 100%; height: 50px; line-height: 50px; background: #f2f2f2; transition:0.3s; } #zzry .swiper-slide:hover .pic img{ transform: scale(1.1);} #zzry .swiper-slide:hover span{ background: #024f93; color: #fff; } #zzry .swiper-button-next,#zzry .swiper-button-prev{ background: #0063d0; width: 45px; height: 45px; line-height: 45px; top: 48%;} #zzry .swiper-button-next:after,#zzry .swiper-button-prev:after{ display: none;} #zzry .swiper-button-next i,#zzry .swiper-button-prev i{ font-size: 40px; color: #fff; transition: 0.3s;} #zzry .swiper-button-next{ right: -2%;} #zzry .swiper-button-prev{ left: -2%;} #zzry .swiper-button-next:hover,#zzry .swiper-button-prev:hover{ background: #333;} @media screen and (max-width:768px){ #zzry .swiper-container{ padding: 3% 5%;} #zzry .swiper-button-next{ right:0;} #zzry .swiper-button-prev{ left:0;} #zzry .swiper-button-next,#zzry .swiper-button-prev{ width: 30px;} #zzry .swiper-button-next i,#zzry .swiper-button-prev i{ font-size: 30px;} } /*产品中心*/ .hui{ background: #f4f6f8;} #cplb{ border-bottom: 1px solid #f1f1f1; line-height: 60px;} #cplb li{ text-align: center; margin: 0 3%; float: left; color: #666666; position: relative;} #cplb li:before{ position: absolute; content: ''; left: 0; bottom: 0; width: 0; height: 2px; background: #e50110; transition: 0.3s;} #cplb li:hover{ color: #e50110;} #cplb li:hover:before{ width: 100%;} #cplb li.on{ color: #e50110;} #cplb li.on:before{ width: 100%;} .cp_con li{ border: 1px solid #eceae9; transition: 0.3s;} .cp_con li .pic{ width: 100%; height: 0; padding-bottom: 100%; position: relative; overflow: hidden;} .cp_con li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s; } .cp_con li .tit{ color: #666666; font-size: 16px; text-align: center; font-weight: bold; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; height: 50px; line-height: 50px; margin-top: 10px;} .cp_con li dl{ text-align: center;} .cp_con li dl dt{ float: left; width: 45%; margin: 0 1%; height: 45px; line-height: 45px; border: 1px solid #e0e0e0; font-size: 15px; transition:0.3s;} .cp_con li dl dt:last-of-type{ float: right; border: 1px solid #0063d0; color: #0063d0;} .cp_con li dl dt:last-of-type a{ color: #0063d0;} .cp_con li:hover{ box-shadow: -5px 8px 10px rgba(204,204,204,0.5);} .cp_con li:hover dl dt{ background: #ff6101; color: #fff;} .cp_con li:hover dl dt a{ color: #fff;} .cp_con li:hover dl dt:last-of-type{ background: #0063d0; color: #fff;} .cptel i{ float: left; color: #e50110; font-size: 45px; margin: 6% 4% 0 0;} .cptel .left{ padding-left: 10px; line-height: 28px;} .cptel .left p{ color: #666666; font-size: 14px;} .cptel .left span{ color: #e50110; font-size: 32px; font-weight: bold;} #cpgg{ background-color: #0063d0; background-image: linear-gradient(to right, #0063d0 , #3d8b80); padding: 1% 0;} #cpgg li{ color: #fff;} #cpgg li i{ float: left; font-size: 50px;} #cpgg li .float-left{ padding-left: 5%; line-height: 35px; width: 83%;} #cpgg li .float-left p{ font-size: 24px;} #cpgg li .float-left span{ display: block; line-height: 20px;} @media screen and (max-width:1400px){ #cpgg li .float-left{ width: 78%; line-height: 20px;} #cpgg li .float-left p{ font-size: 20px;} #cpgg li .float-left span{ font-size: 14px;} } @media screen and (max-width:1200px){ #cpgg li .float-left{ width: 75%; line-height: 20px;} } @media screen and (max-width:765px){ #cpgg li{ padding: 0 0.5%; margin: 3% 0;} #cpgg li i{ font-size: 35px;} #cpgg li .float-left{ width: 80%; line-height: 20px;} #cpgg li .float-left p{ font-size: 16px;} #cpgg li .float-left span{ font-size: 12px;} } #xgcp{ padding: 7% 0 2%;} #xgcp li{ margin-bottom: 10%;} #xgcp li .pic{ width: 100%; height: 0; padding-bottom: 100%; position: relative; overflow: hidden;} #xgcp li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition: 0.3s;} #xgcp li p{ height: 40px; line-height: 40px; background: #f4f4f4; text-align: center; transition: 0.3s; white-space: nowrap; overflow:hidden; text-overflow: ellipsis;} #xgcp li:hover p{ background: #ff6101; color: #fff;} #xgcp li:hover .pic img{ transform: scale(1.1);} #cpbtqh{ width: 100% !important; transition:0.3s; background: #f6f6f6; text-align: center;} .cpbt{ margin: 0 auto !important; height: 55px; line-height: 55px; border-bottom: 1px solid #efefef; width: 100%; transition:0.3s;} .cpbt li{ float: left; color: #333333; font-size: 16px; width: 25%; text-align: center; position: relative; transition:0.3s;} .cpbt li:before{ position: absolute; right: 0; top: 30%; width: 1px; height: 40%; content: ''; background: #d5d5d5;} .cpbt li:last-of-type:before{ display: none;} .cpbt li:hover{ background: #0063d0; color: #fff;} .cpbt li:hover a{ color: #fff !important;} .cpbt li.current a{ color: #333;} .cpbt li.current{ background: #fff; border-top: 3px solid #0063d0;} .cpbtqh_active{ top: 100px; position: fixed; left: 0; z-index: 9;} @media screen and (max-width:1440px){ .cpbtqh_active{ top: 90px;} } @media screen and (max-width:1400px){ .cpbtqh_active{ top:11.5%;} } @media screen and (max-width:1200px){ .cpbtqh_active{ top:10.5%;} } @media screen and (max-width:765px){ .cpbt li{ width: 25%; font-size: 13px;} } .tit_cp{ text-align: center; color: #333333; font-size: 24px; position: relative; height: 40px; margin: 3% auto;} .tit_cp span{ color: #e50113; font-weight: bold;} .tit_cp:before{ position: absolute; left: 46%; bottom: 0; width: 8%; height: 1px; background: #d0d0d0; content: '';} .tit_cp:after{ position: absolute; left: 48%; bottom: -10px; width: 4%; height: 1px; background: #d0d0d0; content: '';} #shili{ margin-top: 5% !important; } #shili li i{ background: #333; width: 150px; height: 150px; border-radius: 100%; text-align: center; line-height: 150px; color: #fff; font-size: 50px; margin: 0 auto; transition: 0.3s;} #shili li p{ text-align: center; color: #666666; font-size: 18px; padding-top: 3%;} #shili li p span{ color: #e50113;} #shili li:hover i{animation: swing 1s; background: #333;} @-webkit-keyframes swing{ 20%{-webkit-transform:rotate(15deg);} 40%{-webkit-transform:rotate(-10deg);} 60%{-webkit-transform:rotate(5deg);} 80%{-webkit-transform:rotate(-5deg);} 100%{-webkit-transform:rotate(0);} } @-moz-keyframes swing{ 20%{-moz-transform:rotate(15deg);} 40%{-moz-transform:rotate(-10deg);} 60%{-moz-transform:rotate(5deg);} 80%{-moz-transform:rotate(-5deg);} 100%{-moz-transform:rotate(0);} } @-ms-keyframes swing{ 20%{-ms-transform:rotate(15deg);} 40%{-ms-transform:rotate(-10deg);} 60%{-ms-transform:rotate(5deg);} 80%{-ms-transform:rotate(-5deg);} 100%{-ms-transform:rotate(0);} } @keyframes swing{ 20%{transform:rotate(15deg);} 40%{transform:rotate(-10deg);} 60%{transform:rotate(5deg);} 80%{transform:rotate(-5deg);} 100%{transform:rotate(0);} } #shebei{ margin-top: 5% !important;} #shebei .big{ width: 100%; height: 0; padding-bottom: 50%; position: relative; overflow: hidden;} #shebei .big img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;} #shebei .tit{ text-align: center; font-weight: bold; color: #333333; font-size: 24px; height: 60px; line-height: 60px;} #shebei .tit span{ color: #0063d0;} #shebei .small{ margin-bottom: 10%; position: relative;} #shebei .small .pic{ width: 100%; height: 0; padding-bottom: 75%; position: relative; overflow: hidden;} #shebei .small .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: 0.3s;} #shebei .small p{ position: absolute; width: 60%; height: 40px; line-height: 40px; bottom: 5%; left: 20%; background: rgba(0,78,161,0.8); text-align: center; color: #fff; transition: 0.3s; font-size: 15px;} #shebei .small:hover p{ bottom: 0; left: 0; width: 100%;} #shebei .small:hover .pic img{transform: scale(1.1);} @media screen and (max-width:765px){ #shebei .tit{ height: auto; line-height: 30px; padding: 3% 0;} } #shouhou{ margin-top: 5% !important;} #shouhou li{ background: #f8f8f8; text-align: center; margin-bottom: 5%; padding: 5% 0;} #shouhou li .pic{ padding: 5% 0;} #shouhou li p{ color: #55575e; font-size: 18px;} #shouhou li span{ display: block; color: #8a8f96; padding: 3% 10% 0;} .contact_item{ padding:0; text-align: center; margin-top: 3%;} .contact_item li{ display: inline-block; margin-bottom: 30px;} .contact_item li span{display: block;width: 150px;height: 135px;margin:0 auto;text-align: center;position: relative;} .contact_item li span.contact_item_1{background: url(/static/index/zm001/images/contact_li_bg1.png) center no-repeat;line-height: 108px;} .contact_item li span.contact_item_2{background: url(/static/index/zm001/images/contact_li_bg2.png) center no-repeat;line-height: 135px;} .contact_item li span.contact_item_3{background: url(/static/index/zm001/images/contact_li_bg3.png) center no-repeat;line-height: 170px;} .contact_item li span img{vertical-align: middle;} .contact_item_ewm{width: 84px;height: 84px;position: absolute;left: 33px;top:46px;z-index: 1;} .contact_item_ewm img{width: 84px;height: 84px;position: absolute;left: 0;top:0;transition: all .4s;vertical-align: top;} .contact_item li h4{color: #333;font-size: 18px;line-height: 30px; text-align: center;margin: 10px auto !important; font-weight: bold !important;} .contact_item li p{color: #333;font-size: 14px;line-height: 26px;} .contact_item li:nth-child(3n) p{text-align: center;} .in_title{ line-height: 40px; padding: 30px 0 10px; color: #747474; font-size: 16px; margin-top: 3% !important;} .in_title p{ font-size: 30px; color: #3e3e3e;} .news-list3 {padding-bottom: 1.125rem; margin-top: 3%;} .news-list3 .item {box-sizing: border-box;border-bottom: 1px solid #dedede;border-right: 1px solid #dedede;} .news-list3 .con-box .date {font-size: 0;} .news-list3 .con-box a { display: block;} .news-list3 .con-box .d, .news-list .con-box .ym {display: inline-block;*display: inline;zoom: 1;} .news-list3 .con-box .d {font-size: 4rem; line-height: 4.25rem; color: #999; transition: all .2s;} .news-list3 .con-box .ym { font-size: 1.5rem;line-height: 1.75rem;margin-left: .625rem;color: #999;} .news-list3 .con-box .img {margin-top: .9375rem;} .news-list3 .con-box .tit { font-size: 15px; line-height: 30px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all .2s; } .news-list3 .con-box .con { font-size: 14px; line-height: 25px; color: #999; margin-top: .625rem; height: auto; overflow: hidden;} .news-list3 .con-box .detail { width: 30%; height: 30px; font-size: 0; text-align: center; border: 1px solid #ccc; border-radius: 20px; margin-top: 1.875rem; transition: all .2s;} .news-list3 .con-box .detail span { display: inline-block; *display: inline; zoom: 1; font-size: .3125rem; line-height: 30px; color: #ccc; padding-right: 2.75rem; background-repeat: no-repeat; background-position: right center; background-image: url("/static/index/zm001/images/news-detail.png"); transition: all .2s;} .news-list3 .con-box:hover .detail{ background: #ff6101; color: #fff; border: 1px solid #e50113; width: 35%;} .news-list3 .con-box:hover .detail span{ color: #fff; background-image: url("/static/index/zm001/images/news-detail2.png");} .news-list3 .con-box:hover .d,.news-list3 .con-box:hover .ym{ color: #0063d0;} @media screen and (max-width:765px){ .news-list3 .con-box .detail{ width: 30%;} } .news01 {padding: 3% 0 0;} .news01 li{ margin-bottom: 5%;} .news01 .imgbox {width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;} .news01 .imgbox img { object-fit: cover; left: 0; position: absolute; text-align: center; height:100%; width:100%; transition: 0.3s;} .news01 .shuiyin{position: absolute; background: url("/static/index/zm001/images/shuiyin.png") no-repeat center; z-index: 1; left: 0; top: 0; width: 100%; height: 100%;} .news01 .imgbox1 {width: 100%; height: 0; padding-bottom: 80%; position: relative; overflow: hidden;} .news01 .imgbox1 p { text-align: center; left: 0; position: absolute; height:100%; width:100%; transition: 0.3s;} .news01 .imgbox1 p img{ max-width: 100%; max-height: 100%; transition:0.3s;} .news01 .slide:hover .imgbox img {transform: scale(1.1);} .news01 .txtbox { height: 50px; line-height: 50px; text-align: center; font-size: 16px; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; position: relative; background: #efefef;} .news01 .txtbox span{ display: block; z-index: 1; position: relative; transition:0.3s;} .news01 .txtbox:after { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: #0063d0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; -moz-transform-origin: left; -ms-transform-origin: left; -o-transform-origin: left; transform-origin: left; left: 0; } .news01 .slide:hover .txtbox::after { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: right; -moz-transform-origin: right; -ms-transform-origin: right; -o-transform-origin: right; transform-origin: right; right: 0; } .news01 .slide:hover .txtbox span{ color: #fff;} @media screen and (max-width:1200px){ .news01 .txtbox{ font-size: 14px;} } #indexNews li{width: 100%;height: auto; margin:0 auto; padding: 4% 0; transition: 0.3s; border-bottom: solid 1px #e8e8e9; } #indexNews li .right{ padding: 0 0 0 4% !important; line-height: 25px;} #indexNews li .news_title{ text-align: left; color: #333333; font-size: 18px; white-space: nowrap; text-overflow:ellipsis; overflow: hidden; line-height: 30px;} #indexNews li .news_info{ color: #999999; font-size: 14px;} #indexNews li .news_time{ line-height: 30px; text-align: center; font-weight: normal !important; border-right:solid 1px #e8e8e9; color: #666666;font-size: 1.5rem; padding: 0 !important; margin: 0 !important;} #indexNews li .news_time span{display: block; margin:0 auto; line-height: 45px; width: 100%; text-align: center; color: #666666; font-size: 50px; font-family: Bahnschrift;} #indexNews li:last-of-type{ border-bottom: none;} #indexNews li:hover{ background: #0063d0;} #indexNews li:hover .news_title,#indexNews li:hover .news_time,#indexNews li:hover .news_time span{ color: #fff;} #indexNews li:hover .news_info{ color: rgba(255,255,255,0.6);} @media screen and (max-width:768px){ #indexNews li .news_time span{ font-size: 40px;} #indexNews li .news_time{ font-size: 12px;} } .pro-nav { width: 100%; margin: 0 auto; border-bottom: 1px solid #eee; line-height: 50px; } .pro-sub-nav { margin: 0 auto !important; } .pro-sub-nav li { height: 50px; line-height: 50px; display: block; float: left; width: 14%; position: relative; } .pro-sub-nav li:after { position: absolute; content: ""; width: 1px; height: 15px; top: 0; bottom:0; right: 0; margin: auto; background: #999 } .pro-sub-nav li:nth-last-of-type(1):after { position: absolute; content: ""; width: 0px; height: 20px; top: 10px; right: 0; } .pro-sub-nav li.current a{ color: #ff6101} .pro-sub-nav li.current a:after{ width: 100%; left:0; color: #ff6101} .pro-sub-nav li a { display: block; width: 100%; font-size: 16px; text-align: center; color: #333; transition: all 0.5s; position: relative; } .pro-sub-nav li a:after { position: absolute; content: ""; bottom: 0px; width: 0; height: 2px; background: #ff6101; left: 45%; transition: all 0.5s } .pro-sub-nav li a:hover:after { width: 100%; left: 0; } .pro-sub-nav li a:hover { color: #ff6101 } .fix li a:hover { color: #ff6101; } .fix { transition: all 0.5s; background:rgba(255,255,255,1); position: fixed; left: 0; top: 88px; z-index: 10; box-shadow: 10px 10px 20px rgba(0,0,0,0.3); } .fix li a { color: #333; font-weight: 100 } @media screen and (max-width:768px){ .pro-sub-nav li{ width: 24%; height: 40px; line-height: 40px;} .pro-sub-nav li a{ font-size: 14px;} .pro-sub-nav li:last-of-type{ display: none;} .fix{ top:47px;} } /*公共*/ .pro-sider { float: none; background: #fff; margin-bottom: 5%; } .pro-sider .in-title { padding: 3%; overflow: hidden; background-color: #0063d0; line-height: 30px; } .pro-sider .in-title h3 { line-height: 60px; padding-left: 8%; font-size: 20px; color: #fff; } .pro-sider .in-title h3 i{ display: block; float: right; color: #fff; font-size: 30px;} .pro-sider .in-title em { font-size: 12px; color: rgba(255,255,255,0.5); font-family: arial; text-transform: uppercase; } .pro-sider-ul { height: auto; text-align: left; background: #fff; padding: 15px; border: 1px solid #ebebeb;} .pro-sider-ul .ul-li{ padding: 0;} .pro-sider-ul .big { display: block; cursor: pointer; background: #f6f6f6; margin-bottom: 5px; padding: 0 15px; height: 40px; line-height: 40px; transition: 0.3s;} .pro-sider-ul .big i{ float: left; color: #9c9c9c; font-size: 20px; padding-right: 20px;} .pro-sider-ul .big p{ color: #333333; font-size: 18px;} .pro-sider-ul .big:hover { background: #ff6101; color: #fff !important; } .pro-sider-ul .big:hover i{ color: #fff;} .pro-sider-ul .small{ display: block; height: 40px; line-height: 40px; font-size: 14px; margin: 0 15px; padding-left: 60px; border-bottom: 1px dashed #efefef;} .pro-sider-ul #li-on a{ background: #ff6101; color: #fff !important;} .pro-sider-ul #li-on i{color: #fff;} @media screen and (max-width:768px){ .pro-sider-ul .ul-li{ padding: 3% 0 3% 2%;} .pro-sider-ul .ul-li p{ font-size: 13px;} .pro-sider-ul .ul-li span{ font-size: 12px;} } .page { font-size: 0; text-align: center; } .page .center { display: inline-block; overflow: hidden; } .page .center .page-span { float: left; font-size: 14px; color: #c3c3c3; line-height: 32px; margin-right: 30px; } .page .center .page-list { float: left; overflow: hidden; } .page .center .page-list ul li { float: left; width: auto; min-width: 30px; height: 32px; text-align: center; line-height: 30px; font-size: 14px; margin: 0 4px; padding: 0; border: none; background: transparent; } .page .center .page-list ul li a { min-width: 20px; padding: 0 5px; border: 1px solid #eee; display: block; color: #333; border-radius: 4px; -webkit-border-radius: 4px; overflow: hidden; background: #fff; } .page .center .page-list ul li:hover a { color: #f3c04b; } .page .center .page-list ul li.active a { background: #f3c04b; color: #fff; }