锘 body { font-family: 'Microsoft YaHei', "Open Sans", sans-serif; font-size: 14px; color: #333; } input, select, textarea { font-family: 寰蒋闆呴粦, "Open Sans", sans-serif; font-size: 1em; ; } .wrap { width: 96%; margin: 0 auto; max-width: 1200px; position: relative; } img, a { border: 0; } ul, li { list-style: none; } * { margin: 0; padding: 0; } .flt { float: left; } .frt { float: right; } .clear { clear: both; } .clear:after, .clear:before { content: ''; clear: both; display: table; } img { max-width: 100%; } .img { overflow: hidden; position: relative; } .img:hover img { transform: scale(1.1) rotate(3deg); -o-transform: scale(1.1) rotate(3deg); -webkit-transform: scale(1.1) rotate(3deg); -moz-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); } h3 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: normal; font-size: 18px; color: #000; line-height: 1.2em; } p { line-height: 32px; color: #666; } *, *:after, *:before { transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; } .modal, .fp_modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000 } .fp_modal { display: table; } .modal { transition: all 0s; -o-transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; background: rgba(0,0,0,0.7); } .fp_modal .cell { display: table-cell; vertical-align: middle; } .modal_cont { max-width: 990px; margin: 0 auto; width: 90%; background: #fff; position: relative; } .modal_cont .close { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; background: url(../images/close.png) no-repeat center center #ccc; border-radius: 100%; cursor: pointer; } .modal_cont .box { padding: 45px; } /*----------header----------*/ .header { border-bottom: 1px solid rgba(255,255,255,.2); position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; } .header.fixed .logo { padding: 15px 0; } .header.fixed .menu ul li a { line-height: 58px; } .header.fixed .menu ul li li a { line-height: 35px; } .header.fixed { background: rgba(0,0,0,0.8) } .head { line-height: 42px; border-bottom: 1px solid #eee } .logo { padding: 35px 0; line-height: 28px; font-size: 16px; } .logo span { display: inline-block; position: relative; color: #cca384; padding-left: 53px; margin-left: 20px; border-left: 1px solid #675e58; background: url(../images/icon1.png) no-repeat 20px center; } .logo img { vertical-align: middle; } .menu ul li { position: relative; float: left; margin: 0 40px; font-size: 14px; } .menu ul li .drop { transition: all 0s; -o-transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; display: none; position: absolute; top: 100%; left: 0; width: 142px; left: 50%; margin-left: -71px; padding-top: 5px; box-shadow: 0 0 5px rgba(0,0,0,0.1) } .menu ul li .drop ul { background: #fff; margin: 0 auto; padding: 10px 0; } .menu ul li .drop ul li a { line-height: 42px; color: #000 } .menu ul li .drop ul li a:after { display: none; } .menu ul li .drop ul li { float: none; margin: 0 auto; text-align: center; } .menu ul li .drop ul li.on a, .menu ul li .drop ul a:hover { color: #cea76e } .menu ul li a { line-height: 98px; display: block; color: #fff; position: relative; } .menu ul li a:after { content: ''; display: block; position: absolute; width: 0%; margin: 0 auto; left: 0; right: 0; height: 3px; bottom: -1px; background: #cca384 } .menu ul li.on a:after, .menu ul li a:hover:after { width: 100%; } .menu ul li a:hover, .menu ul li.on a { color: #cea76e } .menu ul { margin: 0 -40px; } .banner .item { position: relative; font-family: Arial; } .banner .item .text { left: 0; width: 100%; text-align: center; color: #fff; position: absolute; top: 50%; transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); font-size: 24px; } .banner .text h2 { font-size: 2em; margin-bottom: 1em; } .owl-theme .owl-dots .owl-dot span { width: 20px; height: 4px; border-radius: 0; margin: 0 5px; opacity: .5; background: #cea76e; } .owl-theme .owl-dots { margin-bottom: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #cea76e; opacity: 1; width: 28px; } ul:after { content: ''; display: block; clear: both; } .banner .img1 { overflow: hidden; } .team_list ul li { width: 25%; float: left; } .team_list { margin-bottom: 20px; } .team_list a { border-bottom: 1px solid #212121; overflow: hidden; display: block; margin: 20px; position: relative; padding-bottom: 98px; } .team_list .text { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px 0; text-align: center; border: 1px solid #212121; border-bottom: 0; } .team_list p { color: #999 } .team_list h3 { font-size: 22px; } .team_list .text2 { position: absolute; bottom: -100%; left: 0; right: 0; background: #fff; text-align: center; border: 1px solid #cea76e; border-top: 0; padding: 30px 0; border-bottom: 0; } .team_list .text2 label { display: block; margin: 10px auto; margin-bottom: 15px; width: 35px; height: 3px; background: #cea76e } .team_list .text2 h3 { color: #cea76e } .team_list .text2 p { width: 90%; margin: 0 auto; line-height: 26px; color: #666 } .team_list ul { margin: 0 -20px; } .team_list a:hover { border-bottom-color: #cea76e } .team_list a:hover .text2 { bottom: 0 } .team_list img { display: block; } .team_list .img { position: relative; } .team_list .img span { display: block; position: absolute; top: 30px; left: 20px; width: 14px; height: 89px; /*background: url(../images/logo2.png) no-repeat center center;*/ } .center { text-align: center; } .news_list ul li { margin-top: 24px; } .news_list ul li:first-child { margin-top: 0 } .news_list ul li .img { height: 210px; overflow: hidden; float: left; width: 280px; } .news_list ul li:after { content: ''; display: block; } .news_list ul li .text { overflow: hidden; border: 10px solid #f4f4f4; border-left: 0; height: 130px; padding: 30px; } .news_list ul li .text .time { color: #cea76e } .news_list ul li .text h3 { font-size: 20px; margin-bottom: 15px; line-height: 30px; margin-top: 5px; } .news_list ul li .text p { color: #666; height: 64px; overflow: hidden; } .news_list ul li a:hover .text h3, .news_list ul li a:hover .text p { color: #cea76e } /*----------mainer----------*/ .page { overflow: hidden; position: relative; padding: 82px 0; } .page .bg_fff { position: absolute; left: 0; right: 0; height: 25%; background: #fff; bottom: 0 } .page .bg_000 { position: absolute; left: 0; right: 0; height: 100%; background: #000; bottom: 0; opacity: .4 } .page.on { background: #f6f6f6 } .page_tit { text-align: center; margin-bottom: 40px; } .page_tit h3 { font-size: 32px; font-weight: normal; } .page_tit label { display: block; margin: 15px auto; width: 44px; height: 3px; background: #007eff } .page_tit p { margin-top: 20px; font-size: 14px; } .about_img { float: right; margin-left: 85px; } .about_txt { overflow: hidden; } .about_txt h3 { font-size: 32px; margin-bottom: 20px; line-height: 45px; padding-top: 20px; } .about_txt .text { height: 500px; } .btn a { display: inline-block; text-align: center; width: 122px; line-height: 38px; color: #fff; background: #cea76e } .btn a:hover { background: #bc8b43 } .full { position: fixed; top: 50%; right: 0; z-index: 1001; } .full li a { display: block; width: 52px; height: 52px; margin-bottom: 1px; position: relative; background: rgba(0,0,0,0.5); z-index: 1; } .full li a:hover span, .full li a:hover label { background-color: #cea76e !important; } .full li:last-child a { border-bottom: 0; } .full li a span { display: block; width: 52px; height: 52px; position: relative; z-index: 100; background-position: center center; background-repeat: no-repeat; } .full li:nth-child(2) a, .full li:nth-child(1) a { z-index: 2; } .full li a label { display: block; width: 100px; white-space: nowrap; padding: 0 20px; position: absolute; line-height: 52px; color: #fff; z-index: -1; background: #000; bottom: 0; left: 100%; box-sizing: inherit; max-width: 300%; ; } .full li a:hover label { left: -120px; } .full li a .lbl_img { padding: 10px; height: auto; line-height: normal; } .full li a span.span1 { background-image: url(../images/full1.png); } .full li a span.span2 { background-image: url(../images/full2.png); } .full li a span.span3 { background-image: url(../images/full3.png); } .full li a span.span4 { background-image: url(../images/full4.png); } .service_list ul li { position: relative; z-index: 10; width: 33.333%; float: left; } .service_list ul li a { box-shadow: 0 0 5px rgba(0,0,0,0.1); display: block; margin: 25px; border-bottom: 3px solid #59534e; background: #fff; text-align: center; position: relative; } .service_list ul li a:after { content: ''; display: block; position: absolute; left: 0; right: 0; bottom: 0; height: 50%; background: #fff; z-index: -1; } .service_list ul li a:hover { background: #212121; border-bottom-color: #212121 } .service_list ul { margin: -25px; } .service_list .img { height: 167px; } .service_list .img.img1 { background: url(../images/icon2.png) no-repeat center center; } .service_list .img.img2 { background: url(../images/icon3.png) no-repeat center center; } .service_list .img.img3 { background: url(../images/icon4.png) no-repeat center center; } .service_list .img.img4 { background: url(../images/icon5.png) no-repeat center center; } .service_list .img.img5 { background: url(../images/icon6.png) no-repeat center center; } .service_list .img.img6 { background: url(../images/icon7.png) no-repeat center center; } .service_list a:hover p { color: #fff; } .service_list a:hover h3 { color: #cf9e5d } .service_list a:hover .img.img1 { background: url(../images/icon2-1.png) no-repeat center center; } .service_list a:hover .img.img2 { background: url(../images/icon3-1.png) no-repeat center center; } .service_list a:hover .img.img3 { background: url(../images/icon4-1.png) no-repeat center center; } .service_list a:hover .img.img4 { background: url(../images/icon5-1.png) no-repeat center center; } .service_list a:hover .img.img5 { background: url(../images/icon6-1.png) no-repeat center center; } .service_list a:hover .img.img6 { background: url(../images/icon7-1.png) no-repeat center center; } .service_list p { line-height: 22px; height: 44px; overflow: hidden; max-width: 265px; margin: 20px auto; width: 95%; } .service_list .text { padding-bottom: 20px; } /*----------footer----------*/ .footer { background: #272727 } .page3 { padding: 150px 0; clear: both; background: url(../images/page3.jpg) no-repeat center center; background-attachment: fixed; } .banner_txt { color: #fff; } .banner_txt .span_tit { width: 90px; height: 117px; border: 4px solid #fff; display: block; float: left; text-align: center; font-size: 28px; padding-top: 20px; margin-right: 30px; } .banner_txt .span_tit label { display: block; height: 40px; background: url(../images/icon8.png) no-repeat center center; } .banner_txt .text { overflow: hidden; } .banner_txt .text h3 { font-size: 28px; color: #fff; margin-bottom: 20px; } .banner_txt .text p { font-size: 18px; color: #fff; max-width: 700px; } .pagesize { text-align: center; padding: 70px 0; } .pagesize a { display: inline-block; line-height: 36px; height: 36px; background-repeat: no-repeat; background-position: center center; min-width: 16px; padding: 0 10px; margin: 5px; vertical-align: middle; border: 1px solid #f2f2f2; color: #666; } .pagesize a:hover, .pagesize a.on { background-color: #cea76e; border-color: #cea76e; color: #fff; } .foot { padding: 60px 0; } .f_logo { float: left; padding-top: 40px; margin-right: 40px; text-align: center; } .f_logo h3 { margin-top: 20px; color: #fff; } .address { border-left: 1px solid #fff; float: left; color: #fff; padding: 10px 0; padding-left: 40px; } .address p, .address h3 { color: #fff; line-height: 24px; } .address h3 { font-size: 22px; } .address p { min-height: 24px; } .ewm { float: right; width: 125px; text-align: center; color: #fff; } .ewm span { display: block; margin-top: 15px; } .copyright { text-align: center; color: #fff; border-top: 1px solid #303030; line-height: 30px; padding: 17px 0; } .copyright a { color: #fff } .copyright a:hover { color: #999 } .his_list { padding-top: 20px; position: relative; } .his_list .line { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0 auto; width: 1px; background: #cea76e } .his_list ul li { text-align: right; margin: 20px 0; width: 50%; padding-right: 50%; clear: both; position: relative; } .his_list ul li i { position: absolute; left: 50%; margin-left: -8px; top: 10px; width: 8px; height: 8px; border-radius: 100%; background: #cea76e; border: 4px solid #fff; } .his_list ul li i:after { content: ''; display: block; position: absolute; left: 50%; margin-left: -80px; width: 60px; height: 1px; background: #d3d3d3; top: 4px; } .his_list ul li:nth-child(2n) i:after { margin-left: 20px; } .his_list ul li:nth-child(2n) { padding-right: 0; padding-left: 50%; text-align: left; } .his_list ul li:nth-child(2n) .text { padding-left: 100px; padding-right: 0 } .his_list ul li .text { padding: 0 100px; padding-left: 0; line-height: 28px; color: #000; } .his_list ul li .text h3 { font-size: 20px; color: #000; font-weight: normal; margin-bottom: 10px; } .ry_list { margin: 0 auto; } .ry_list li { width: 25%; float: left; margin: 14px 0%; text-align: center; line-height: 40px; } .ry_list li h3 { margin-top: 20px; font-size: 18px; } .ry_list li .img { border: 1px solid #efefef; margin: 0 14px; } .ry_list li:nth-child(4n+1) { clear: both; } .ry_list li .img img { display: block; } .zp_p_list { margin: 0 auto; line-height: 28px; color: #4c4c4c; } .zp_p_list a { color: #be9a78; } .bold { font-weight: bold; } .zp_p_list .list { color: #666; } .zp_p_list .list:last-child { border-bottom: 0; } .zp_p_list .list h3 { font-size: 20px; font-weight: normal; color: #000; margin-bottom: 5px; line-height: 40px; } .zp_p_list .box { padding: 0 20px; } .zp_p_list .box .list { padding: 20px 0; } .zp_p_list .text h4 { font-size: 16px; color: #333; font-weight: normal; margin-bottom: 10px; padding-left: 15px; border-left: 4px solid #cea76e; height: 16px; margin: 10px 0; line-height: 16px; } .zp_p_list .title { border-bottom: 1px solid #e7e3e2; cursor: pointer; line-height: 78px; background: url(../images/icon12.png) no-repeat 98% center; padding: 0 20px; } .zp_p_list .title span { display: inline-block; margin-right: 75px; color: #666; } .zp_p_list .title span.span1 { font-size: 22px; color: #000; } .zp_p_list .box { display: none; transition: all 0s; -o-transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; } .zp_p_list .on .title, .zp_p_list li:hover .title { background: url(../images/icon12-1.png) no-repeat 98% center; } .news_details .d_text { background: #f6f6f6; padding: 38px; } .news_details .d_text h2 { text-align: center; font-size: 20px; font-weight: normal; line-height: 1.2em; margin-bottom: 10px; } .news_details .d_text .tit { border-bottom: 1px solid #d0d0d0; padding-bottom: 10px; margin-bottom: 20px; } .news_details .d_text h3 { font-size: 16px; margin: 10px 0; font-weight: 600; } .news_details .d_text .text { } .news_details .d_text .text p { margin-bottom: 15px; } .news_details { padding-left: 320px; position: relative; } .news_details.product { padding-left: 300px; } .news_details .news_list, .pro_menu { position: absolute; top: 0; left: 0; width: 280px; } .pro_menu { width: 260px; } .news_details .news_list .text { height: auto; border: 0; padding: 15px 0; } .news_details .news_list .img { float: none; } .news_details .news_list li { margin: 0 } .txt_cur { text-align: right; padding-top: 20px; color: #ccc; border-top: 1px solid #dfdfdf } .txt_cur a { color: #999; display: inline-block; padding: 0 20px; } .txt_cur a:hover { color: #cea76e } .txt_cur a:last-child { padding-right: 0 } .pro_menu .tit { display: none; } .pro_menu ul li { line-height: 52px; border-bottom: 1px solid #fff; } .pro_menu ul li a { display: block; padding: 0 20px; background: url(../images/cur4.png) no-repeat 95% center #f6f6f6; } .pro_menu ul li.on a, .pro_menu ul li a:hover { background: url(../images/cur2.png) no-repeat 95% center #cea76e; } .pro_menu ul li.on a span, .pro_menu ul li a:hover span { color: #fff; } .pro_menu ul li.on a span:after, .pro_menu ul li a:hover span:after { background: #fff; } .pro_menu ul li span { display: block; padding-left: 26px; position: relative; color: #666; } .pro_menu ul li span:after { content: ''; display: block; width: 6px; height: 6px; background: #dedede; position: absolute; left: 0; top: 50%; margin-top: -3px; } .contact_list li { width: 33.333%; float: left; text-align: center; } .contact_list li .img { width: 116px; height: 116px; line-height: 116px; text-align: center; border-radius: 100%; background: rgba(255,255,255,0.05); border: 1px solid #cea76e; margin: 0 auto; margin-bottom: 20px; } .contact_list { width: 80%; margin: 0 auto; padding-bottom: 50px; margin-top: -30px; } .contact_list li .img img { vertical-align: middle; } .contact_list li .text p, .contact_list li .text h3 { color: #ecb564 } .contact_list li .text h3 { font-size: 22px; line-height: 40px; } .contact_list li .text p { max-width: 145px; margin: 0 auto; } .foot_fixed { position: fixed; bottom: 0; left: 0; width: 100%; background: rgba(206,167,110,.6); /*cea76e*/ } .page_banner { text-align: center; line-height: 510px; padding-top: 100px; background: url(../images/bg1.jpg) no-repeat top center; background-attachment: fixed; } .page_banner img { vertical-align: middle; } .page_banner.page_banner1 { background: none; line-height: 430px; } /*----------custom----------*/ @media only screen and (max-width: 1600px) { .banner .item .text { font-size: 22px; } } @media only screen and (max-width: 1200px) { .banner .item .text { font-size: 20px; } .banner img { width: 120%; margin-left: -10%; max-width: initial; } .about_img { margin-left: 30px; width: 50%; } .about_txt .text { height: 400px; } .service_list ul li a { margin: 10px; } .service_list ul { margin: -10px; } .team_list a { margin: 10px; } .team_list ul { margin: -10px; } .menu ul li { margin: 0 30px; } } @media only screen and (max-width: 1000px) { .banner .item .text { font-size: 18px; } .banner img { width: 150%; margin-left: -25%; } } @media only screen and (max-width: 1024px) { .menu { position: fixed; top: 0; left: -110%; width: 100%; height: 100%; background: #fff; } .menu ul li { float: none; display: block; border-bottom: 1px solid #ddd; padding: 0 } .menu ul li a { line-height: 45px; font-size: 18px; } .menu ul { padding-top: 80px; } .header .logo { position: relative; z-index: 1001; line-height: 40px; } .menu_wrap { position: absolute; top: 50%; margin-top: -20px; width: 40px; height: 40px; background: url(../images/menu.png) no-repeat center center #cea76e; background-size: 25px auto; right: 20px; } .h_menu .menu_wrap { background: url(../images/menu-1.png) no-repeat center center #cea76e; background-size: 25px auto; } .h_menu .menu { left: 0; overflow-y: auto; } .menu ul { margin: 0; } .menu ul li a { color: #333; } .menu ul li .drop { position: initial; top: auto; left: auto; width: 100%; margin: 0 auto; padding: 0; box-shadow: none; } .menu ul li .drop ul { padding: 0; } .menu ul li .drop ul a { padding-left: 30px; text-align: left; line-height: 45px; } .header.fixed .menu ul li li a { line-height: 45px; } .header { line-height: 60px; } .wrap { padding: 0 2%; } .header .logo { padding: 15px 0; } .about_txt .text { height: auto; margin-bottom: 20px; } .page { padding: 40px 0; } .foot { padding: 40px 0; } } @media only screen and (max-width: 900px) { .about_img { width: 100%; margin: 0 auto; float: none; } .full { display: none; } } @media only screen and (max-width: 750px) { .logo span { margin-left: 10px; padding-left: 10px; background: none; } .header .logo { padding: 10px 0; } .owl-theme .owl-dots { margin-bottom: 15px; } .service_list ul li { width: 50%; } .service_list .img { height: 100px; } .banner_txt .text p { font-size: 14px; line-height: 25px; } .team_list ul li { width: 50%; } .team_list a { margin: 5px; padding-bottom: 80px; } .team_list .text { padding: 11px 0; } .team_list .text2 { bottom: -150%; } .team_list .text2>p { height: 125px; overflow: hidden; } .team_list .text2 { padding: 15px 0; } .team_list ul { margin: 0 } .news_list ul li .img { width: 110px; height: 82px; } .news_list ul li .text { padding: 10px; border: 0; height: auto; } .news_list ul li .text h3 { margin: 0 auto; margin-bottom: 5px; } .news_list ul li .text p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: auto; } .foot { padding: 20px 0; } .f_logo { float: none; padding-top: 0; text-align: center; margin: 0 auto; } .address p { min-height: 5px; } .address { padding-left: 0; border-left: 0; text-align: center; float: none; } .ewm { float: none; text-align: center; clear: both; margin: 0 auto; } .news_list ul li .text .time { display: none; } .page_banner { padding-left: 10px; padding-right: 10px; padding-top: 100px; padding-bottom: 50px; height: auto; line-height: normal; } .about_txt h3 { font-size: 26px; } .his_list ul li { width: auto !important; padding: 0 !important; text-align: left !important; padding-left: 20px !important; } .his_list .line { left: 5px; margin-left: 0 } .his_list ul li i { left: 5px; top: 5px; } .his_list ul li i:after { display: none; } .zp_p_list .title span.span1 { font-size: 18px; } .zp_p_list .title { line-height: 50px; } .zp_p_list .box .list { padding: 10px 0; } .his_list ul li .text { padding: 0 !important } .ry_list li { width: 50%; } .ry_list li:nth-child(2n+1) { clear: both; } .news_details .news_list, .pro_menu { position: initial; top: auto; left: auto; width: 100%; margin-bottom: 10px; } .pro_menu.on ul { display: block; } .news_details, .news_details.product { padding-left: 0; } .pro_menu .tit { display: block; font-size: 18px; line-height: 50px; background: #f1f2f3 url(../images/cur6-1.png) no-repeat 95% center; ; padding: 0 15px; } .pro_menu ul li { line-height: 40px; } .pro_menu ul { display: none; } .news_details .d_text { padding: 15px; } .news_details .news_list li { width: 30.333%; float: left; margin: 0 1.5%; } .news_details .news_list ul li .text h3 { font-size: 14px; } .news_details .news_list .img { width: 100%; } .page_banner.page_banner1 { line-height: initial; } .contact_list li { width: 100%; } .contact_list li .img { width: 80px; height: 80px; line-height: 80px; float: left; transform: scale(.7); -webkit-transform: scale(.7); -moz-transform: scale(.7); } .contact_list { width: 100%; margin: 0 auto; } .contact_list .text { overflow: hidden; text-align: left; padding-top: 5px; } .contact_list li .text p { text-align: left; max-width: initial; } .contact_list li .text h3 { font-size: 20px; } .pagesize a { padding: 0; width: 25px; height: 25px; line-height: 25px; margin: 2px; } .pagesize { padding: 40px 0; } .page { padding: 20px 0; } }