/* CSS Document*/ @font-face { font-family: 'webfontregular'; font-weight: 600; src: url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.eot'); src: url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.woff2') format('woff2'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.woff') format('woff'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.ttf') format('truetype'), url('../fonts/vziuho9z-oj4wgkppotg1_eszw2xoq-xsnqo47m55da-webfont.svg#webfontregular') format('svg'); font-weight: normal; font-style: normal; } /*icon字体*/ @font-face { font-family:'Open_Sans'; src: url('../font/open_sans-webfont.woff2') format('woff2'), url('../font/open_sans-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } /* CSS Document*/ * { padding: 0px; margin: 0px; outline: 0 none; } a { text-decoration: none; color: #666; transition: all 0.5s ease 0s; } a:focus { outline: none; } a:hover { color: #a93b2b; text-decoration: none; } ul { list-style-type: none; margin-bottom: 0px; } li { vertical-align: bottom; zoom: 1; } img { border: 0px; } select { font-family:'Open_Sans'; color: #666; font-size: 12px; } textarea { font-family:'Open_Sans'; color: #666; font-size: 12px; outline: none; } table { border-collapse: collapse; border-spacing: 0px; } th, td { padding: 0; } input { vertical-align: middle; outline: none; font-size: 12px; font-family:'Open_Sans'; } .clearfix:before, .clearfix:after { content: " "; display: block; height: 0; visibility: hidden; clear: both; overflow: hidden; } .clearfix { zoom: 1; } .clearfix:after { clear: both; } .hidden { display: none; } h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: inherit; margin: 0px; font-family:'Open_Sans'; } p { margin: 0px; font-family:'Open_Sans'; } em, i { font-style: normal; } .fl { float: left; } .fr { float: right; } input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; } @font-face { font-family: 'iconfont'; /* project id 1670834 */ src: url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.eot'); src: url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.eot?#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.woff2') format('woff2'), url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.woff') format('woff'), url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.ttf') format('truetype'), url('https://at.alicdn.com/t/font_1670834_nnqeiloopp.svg#iconfont') format('svg'); } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } body { font-family:'Open_Sans'; background: #fff; color: #666; font-size: 12px; overflow-x: hidden !important; } .container { margin: 0px auto; max-width: 1500px; padding: 0px 100px; } .header { width: 100%; z-index: 200; width: 100%; transition: all 0.5s ease 0s; height: 95px; top: 0px; padding-top: 20px; position: absolute; z-index: 20; } .header .logo { position: relative; height: 100%; float: left; margin-top: 16px; } .header .logo img { width: auto; height: 40px; } .header .logo img.white { display: block; } .header .logo img.red { display: none; } .header .logo a { position: relative; z-index: 10; } .header .head_right { float: right; } .nav { position: relative; z-index: 10; text-align: center; float: right; } .nav .nLi { display: inline-block; position: relative; box-sizing: border-box; text-align: center; } .nav .nLi h3 a { display: inline-block; color: #fff; box-sizing: border-box; font-size: 14px; text-align: center; line-height: 75px; padding: 0px 8px; margin: 0px 8px; position: relative; text-transform: uppercase; font-weight: bold; } .nav .nLi:hover h3 a { color: #881c22; transition: none; } .nav .nLi:hover h3 a:hover::after { content: ''; width: calc(100% - 20px); height: 2px; background: #881c22; position: absolute; left: 10px; bottom: 30px; } .nav .nLi .sub { display: none; left: 50%; transform: translate(-50%, 0%); top: 90px; position: fixed; width: 100vw; background: #f8f8f8; padding: 20px 0px; } .nav .sub .container { position: relative; } .nav .sub .container { display: flex; justify-content: center; } .nav .sub .container .tb { position: relative; margin: 0px 2%; } .nav .sub .container .tb a { text-align: center; display: block; font-size: 12px; text-transform: capitalize; } .nav .sub .container a i { display: block; width: 50px; margin: 0px auto; margin-bottom: 3px; } .nav .sub .container a i img { width: 100%; height: auto; } .nav .sub .container a i img.white { display: block; } .nav .sub .container a i img.red { display: none; } .nav .sub .container a:hover i img.white { display: none; } .nav .sub .container a:hover i img.red { display: block; } .nav .sub .container .tb span { position: fixed; width: 100vw; left: 0px; justify-content: center; display: none; background: #f8f8f8; padding: 15px 0px; } .nav .sub .container .tb span a { line-height: 20px; width: auto; display: inline-block; margin: 0px 10px; color: #666; } .nav .sub .container .tb span .container { display: block; } .nav .sub .container .tb:hover span { display: flex; } .nav .sub .container .tb:hover a { color: #881c22; } .nav .sub .container .tb:hover a img.white { display: none; } .nav .sub .container .tb:hover a img.red { display: block; } .nav .sub .container .tb:hover span a { color: #666; } .nav .on h3 a { color: #fff; } .nav .on h3 a::after { content: ''; width: calc(100% - 20px); height: 2px; background: #fff; position: absolute; left: 10px; bottom: 30px; } .header:hover .nav .on h3 a::after { content: ''; width: calc(100% - 20px); height: 2px; background: #881c22; position: absolute; left: 10px; bottom: 30px; } .in_search { position: relative; float: right; margin-left: 10px; padding-left: 10px; margin-top: 25px; float: right; border-left: 1px solid #fff; line-height: 22px; height: 22px; } .in_search a i { color: #fff; font-size: 22px; } .in_search1{ width:202px; border:1px solid #ddd; position:absolute; right: -10px; top:30px; display:none;} .in_search1 .tex{border:0px; width:150px; height:35px; line-height:35px; padding:0px 10px;} .in_search1 .sub-butn{ width:50px; height:35px; line-height:35px; border:0px; cursor:pointer;} .yuyan { position: relative; float: right; margin-left: 10px; padding-left: 10px; margin-top: 25px; float: right; border-left: 1px solid #fff; line-height: 26px; height: 26px; } .yuyan a { font-size: 15px; color: #fff; } .yuyan .xq { display: none; font-size: 14px; position: absolute; width: 50px; left: 0px; top: 30px; } .scope { background: #fff; transition: all 0.5s ease 0s; box-shadow: 0px 0px 5px #ccc; position: fixed !important; z-index: 200; } .scope .logo img.white { display: none; } .scope .logo img.red { display: block; } .scope .nav .nLi h3 a { color: #333; } .scope .nav .nLi h3 a:hover { color: #881c22; } .scope .nav .sub a:hover { color: #881c22; transition: none; } .scope .nav .on h3 a { color: #881c22; } .scope .nav .on h3 a::after { content: ''; width: calc(100% - 20px); height: 2px; background: #881c22; position: absolute; left: 10px; bottom: 30px; } .product_dh .nav .on h3 a::after { content: ''; width: calc(100% - 20px); height: 2px; background: #881c22; position: absolute; left: 10px; bottom: 30px; } .scope .in_search { border-left: 1px solid #eaeaea; } .scope .in_search a i { color: #333; font-size: 22px; } .scope .yuyan { border-left: 1px solid #eaeaea; } .scope .yuyan a { color: #333; } .header:hover { background: #fff; } .header:hover .logo img.white { display: none; } .header:hover .logo img.red { display: block; } .header:hover .nav .nLi h3 a { color: #333; } .header:hover .nav .nLi h3 a:hover { color: #881c22; } .header:hover .nav .sub a:hover { color: #881c22; transition: none; } .header:hover .nav .on h3 a { color: #881c22; } .header:hover .in_search { border-left: 1px solid #eaeaea; } .header:hover .in_search a i { color: #333; font-size: 22px; } .header:hover .in_search a:hover i { color: #881c22; } .header:hover .yuyan { border-left: 1px solid #eaeaea; } .header:hover .yuyan a { color: #333; } .header:hover .yuyan a:hover { color: #881c22; } .product_dh { position: relative; } .product_dh .logo img.white { display: none; } .product_dh .logo img.red { display: block; } .product_dh .nav .nLi h3 a { color: #333; } .product_dh .nav .nLi h3 a:hover { color: #881c22; } .product_dh .nav .sub a:hover { color: #881c22; transition: none; } .product_dh .nav .on h3 a { color: #881c22; } .product_dh .in_search { border-left: 1px solid #eaeaea; } .product_dh .in_search a i { color: #333; font-size: 22px; } .product_dh .in_search a:hover i { color: #881c22; } .product_dh .yuyan { border-left: 1px solid #eaeaea; } .product_dh .yuyan a { color: #333; } .product_dh .yuyan a:hover { color: #881c22; } /*.reveal-modal-bg {*/ /* z-index: 1000;*/ /* display: none;*/ /* top: 0;*/ /* left: 0;*/ /* background: rgba(0, 0, 0, 0.2);*/ /* position: fixed;*/ /* width: 100%;*/ /* height: 100%;*/ /*}*/ /*.reveal-modal {*/ /* visibility: hidden;*/ /* top: 0px !important;*/ /* left: 0px;*/ /* bottom: 0px;*/ /* width: 100%;*/ /* position: fixed;*/ /* z-index: 1001;*/ /* background: rgba(0, 0, 0, 1.00);*/ /*}*/ /*.reveal-modal .cent-form {*/ /* position: absolute;*/ /* width: 94.8%;*/ /* left: 2.6%;*/ /* top: 50%;*/ /* height: 124px;*/ /* margin-top: -63px;*/ /* border-bottom: 1px solid #515151;*/ /*}*/ /*.reveal-modal .tex {*/ /* border: none;*/ /* font-size: 25px;*/ /* height: 124px;*/ /* line-height: 124px;*/ /* text-align: center;*/ /* width: 100%;*/ /* box-sizing: border-box;*/ /* color: #fff;*/ /* padding-left: 88px;*/ /* padding-right: 80px;*/ /* background: no-repeat 35px 60px;*/ /*}*/ /*.reveal-modal .sub-butn {*/ /* border: none;*/ /* height: 100px;*/ /* margin-top: 24px;*/ /* font-size: 24px;*/ /* line-height: 100px;*/ /* color: #555;*/ /* background: none;*/ /* position: absolute;*/ /* right: 0;*/ /* top: 0;*/ /* width: 80px;*/ /* text-align: center;*/ /*}*/ /*.reveal-modal .close-reveal-modal {*/ /* font-size: 50px;*/ /* line-height: .5;*/ /* position: fixed;*/ /* top: 8px;*/ /* right: 11px;*/ /* color: #aaa;*/ /* text-shadow: 0 -1px 1px rbga(0, 0, 0, .6);*/ /* font-weight: bold;*/ /* cursor: pointer;*/ /*}*/ .reveal-modal-bg { z-index: 1000; display: none; top: 0; left: 0; background: rgba(0, 0, 0, 0.2); position: fixed; width: 100%; height: 100%; } .reveal-modal { visibility: hidden; top: 0px !important; left: 0px; bottom: 0px; width: 100%; position: fixed; z-index: 1001; background: rgba(0, 0, 0, .5); } .reveal-modal .cent-form { position: absolute; width: 94.8%; left: 2.6%; top: 50%; height: 124px; margin-top: -63px; border-bottom: 1px solid #515151; } .reveal-modal .tex { border: none; font-size: 25px; height: 124px; line-height: 124px; text-align: center; width: 100%; box-sizing: border-box; color: #fff; padding-left: 88px; padding-right: 80px; background: no-repeat 35px 60px; } .reveal-modal .tex::-webkit-input-placeholder{ color:#fff; } .reveal-modal .sub-butn { border: none; height: 100px; margin-top: 24px; font-size: 24px; line-height: 100px; color: #fff; background: none; position: absolute; right: 0; top: 0; width: 80px; text-align: center; cursor: pointer; } .reveal-modal .close-reveal-modal { font-size: 50px; line-height: .5; position: fixed; top: 8px; right: 11px; color: #fff !important; font-weight: bold; cursor: pointer; } .headBg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; background: rgba(0, 0, 0, .65); z-index: 5; transition: all 0.3s ease 0s; } .headBg.into { transition: all 0.3s ease 0s; display: block; } .phone_btn { float: right; margin-top: 17px; display: none; } .phone_btn span { width: 20px; height: 17px; display: inline-block; position: relative; } .phone_btn span:before { content: ''; width: 22px; height: 3px; background: #333; position: absolute; top: 0; left: 0; } .phone_btn span:after { content: ''; width: 22px; height: 3px; background: #333; position: absolute; bottom: 0; left: 0; } .phone_btn span i { position: absolute; top: 50%; left: 0; width: 22px; height: 3px; background: #333; margin-top: -2px; } .menu_box { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 11; background: rgba(0, 0, 0, 0.7); transform: translateX(-100%); transition: all 0.3s ease; } .menu_box.into { transform: translateX(0); -webkit-transform: translateX(0); } .menu_cot { width: 70%; height: 100%; background: #fff; transform: translateX(-100%); transition: all 0.3s ease; } .menu_box.into .menu_cot { transform: translateX(0); transition: all 0.3s 0.2s ease; } .menu_close { position: absolute; top: 0; right: 0; width: 30%; height: 100%; } .menu_close img { width: 40px; } .menu_close a { padding: 10px; height: 100%; width: 100%; display: flex; align-items: flex-start; justify-content: flex-end; } .in_banner { height: 100vh; --swiper-theme-color: #fff; /* 设置Swiper风格 */ --swiper-navigation-size: 50px; /* 设置按钮大小 */ } .in_banner .swiper-slide { position: relative; background-size: cover; background-position: center center; } .in_banner .swiper-pagination { bottom: 40px !important; } .in_banner .swiper-pagination span { width: 6px; height: 25px; border:1px solid #fff; border-radius: 2px !important; border-radius: 0px; opacity: 1; margin: 0px 10px !important; background: none !important; } .in_banner .swiper-pagination span:hover{ background: #fff !important; } .in_banner .swiper-pagination span.swiper-pagination-bullet-active { background: #fff !important; } .in_banner .swiper-slide .nr { position: absolute; width: 100%; left: 0%; top: 0px; height: 100%; color: #fff; text-shadow: 0px 2px 10px #666; } .in_banner .swiper-slide .nr .container { height: 100%; } .in_banner .swiper-slide .nr a { display: block; color: #fff; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; } .in_banner .swiper-slide .nr a h2 { font-size: 60px; text-transform: uppercase; } .in_banner .swiper-slide .nr a p { font-size: 26px; display: block; margin: 15px 0px; text-transform: uppercase; } .in_banner .swiper-slide .nr { opacity: 0; transition: all 1.5s ease; } .in_banner .swiper-slide-active .nr { opacity: 1; } .in_box { height: 210px; background: url(../images/in_shuzi.jpg) no-repeat center center; background-size: cover; position: relative; z-index: 10; } .in_box .container { height: 100%; } .in_box ul { display: flex; align-items: center; justify-content: center; height: 100%; } .in_box ul li { width: 25%; height: calc(100% + 40px); color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column; } .in_box ul li:hover { background-image: linear-gradient(#c60c16, #891b22); } .in_box ul li h2 { font-size: 50px; } .in_box ul li p { font-size: 30px; text-transform: uppercase; letter-spacing: -1px; } .in_box1 { position: relative; background: #232323; } .in_box1 img.big { width: 100%; } .in_box1 .in_box1_nr { position: absolute; width: 100%; left: 0px; bottom: 32px; } .in_box1 .in_box1_nr ul { display: flex; align-items: center; justify-content: center; } .in_box1 .in_box1_nr ul li { width: 20%; text-align: center; } .in_box1 .in_box1_nr ul li a { display: block; color: #fff; font-size: 12px; } .in_box1 .in_box1_nr ul li a i { display: block; margin: 0px auto; width: 45px; } .in_box1 .in_box1_nr ul li a i img { width: 100%; } .in_box1 .in_box1_nr ul li a img.white { display: block; } .in_box1 .in_box1_nr ul li a img.red { display: none; } .in_box1 .in_box1_nr ul li a:hover { color: #881c22; } .in_box1 .in_box1_nr ul li a:hover img.white { display: none; } .in_box1 .in_box1_nr ul li a:hover img.red { display: block; } .in_box1 .in_box1_nr .more { text-align: center; padding: 30px 0px; } .in_box1 .in_box1_nr .more a { display: inline-block; width: 170px; height: 45px; line-height: 45px; text-align: center; background: #881c22; color: #fff; font-size: 14px; } .in_box1 .in_box1_nr .more a:hover { opacity: .8; } .in_box2 { padding: 50px 0px; position: relative; --swiper-theme-color: #333; /* 设置Swiper风格 */ --swiper-navigation-size: 50px; /* 设置按钮大小 */ } .in_box2 .bt { text-align: center; font-size: 40px; color: #333; margin-bottom: 30px; } .in_box2_nr .swiper-slide a { display: block; position: relative; } .in_box2_nr .swiper-slide a .img { overflow: hidden; } .in_box2_nr .swiper-slide a .img h2 { transform: scale(1); display: block; transition: all 0.5s ease 0s; background-size: cover; background-position: center center; } .in_box2_nr .swiper-slide a .img img { width: 100%; height: auto; } .in_box2_nr .swiper-slide a:hover .img h2 { transform: scale(1.05); transition: all 0.5s ease 0s; } .in_box2_nr .swiper-slide a .nr { background: #f8f8f8; padding: 15px; } .in_box2_nr .swiper-slide a .nr b { font-weight: normal; color: #999; } .in_box2_nr .swiper-slide a .nr h2 { font-size: 20px; line-height: 24px; color: #333; margin-bottom: 10px; display: block; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 45px; } .in_box2_nr .swiper-slide a:hover .nr h2 { color: #881c22; } .in_box2_nr .swiper-slide a .nr p { font-size: 14px; line-height: 20px; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 60px; } .in_box2_nr_next { right: 50px !important; } .in_box2_nr_prev { left: 50px !important; } .in_box2 .more { text-align: center; padding-top: 50px; } .in_box2 .more a { display: inline-block; width: 170px; height: 45px; line-height: 45px; text-align: center; background: #881c22; color: #fff; font-size: 14px; } .in_box2 .more a:hover { opacity: .8; } .in_box3 { height: 390px; background: url(../images/in_gg.jpg) no-repeat; background-size: cover; background-attachment: fixed; background-position: center center; display: flex; flex-direction: column; align-items: center; justify-content: center; text-shadow: 0px 0px 10px #666; text-transform: uppercase; color: #fff; } .in_box3 h2 { font-size: 45px; } .in_box3 p { font-size: 20px; } .in_box4 { padding: 50px 0px; } .in_box4 .bt { text-align: center; font-size: 40px; color: #333; margin-bottom: 30px; text-transform: uppercase; } .in_box4_nr .swiper-wrapper { -webkit-transition-timing-function: linear; -moz-transition-timing-function: linear; -ms-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; } .in_box4_nr{margin-bottom:0px; height:300px;} .in_box4_nr .swiper-slide{height:140px!important; width:270px!important; background:#fcfcfc;} .in_box4_nr .swiper-slide:nth-child(even){left:130px;} .in_box4_nr .swiper-slide img { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); opacity: .6; width: 100%; height: auto; } .in_box4_nr .swiper-slide:hover img { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; } .marquee-box { overflow: hidden; width: 100%; position: absolute; left: 0; top: 0 } .marquee { width: 8000%; height: 60px } .wave-list-box { float: left } .wave-list-box ul { float: left; height: 60px; overflow: hidden; zoom: 1 } .wave-list-box ul li { height: 60px; width: 100%; float: left; line-height: 30px; list-style: none } .wave-box { position: relative; height: 60px; background: #fff } .footer { position: relative; width: 100%; height: 450px; overflow: hidden; } .footer .canvas { display: block; transform: rotate(180deg); } .calose_canvas { display: none !important; } .footer1 { position: absolute; width: 100%; height: 100%; left: 0px; top: 100px; color: #fff; } .footer .container .footer_nav { width: calc(100% - 360px); float: left; } .footer .container .footer_nav h2 { margin-bottom: 20px; } .footer .container .footer_nav h2 img { width: auto; height: 40px; } .footer .container .footer_nav h3 { display: flex; justify-content: space-between; } .footer .container .footer_nav h3 span p { line-height: 26px; opacity: .9; font-size: 12px; } .footer .container .footer_nav h3 span b { font-weight: normal; font-size: 25px; text-transform: uppercase; margin-top: -20px; padding-bottom: 10px; display: block; } .footer .container .footer_nav h3 span:nth-child(1) { width: 240px; } .footer .container .footer_nav h3 span:nth-child(2) { width: calc(100% - 300px); } .footer .container .footer_nav h3 a { flex: 1; color: #fff; opacity: .9; line-height: 26px; display: inline-block; width: calc(50% - 3px); font-size: 12px; } .footer .container .footer_sub { width: 340px; float: right; margin-bottom: 40px; } .footer .container .footer_sub h2 { color: #fff; font-size: 20px; font-weight: bold; text-transform: uppercase; } .footer .container .footer_sub p { font-size: 13px; padding: 20px 0px; opacity: .8; } .footer .container .footer_sub .search { display: flex; margin-bottom: 15px; } .footer .container .footer_sub .search .text { background: #9e200f; border-radius: 0; border: 0; color: #fff; display: inline-block; font-size: 13px; padding: 0 20px; vertical-align: middle; height: 55px; width: calc(100% - 55px); } .footer .container .footer_sub .search .text::-webkit-input-placeholder { color: #fff; opacity: .8; } .footer .container .footer_sub .search .anniu { background: #881c22; border: 0; color: #fff; display: inline-block; vertical-align: middle; font-size: 15px; font-weight: 600; height: 55px; width: 100px; cursor: pointer; } .footer .container .footer_sub h3 { padding-top: 10px; position: relative; } .footer .container .footer_sub h3 a { display: inline-block; width: 42px; text-align: center; height: 42px; border-radius: 50%; background: #9e230d; color: #fff; margin-right: 10px; position: relative; overflow: hidden; } .footer .container .footer_sub h3 a i { display: block; font-size: 20px; line-height: 42px; position: relative; z-index: 3; } .footer .container .footer_sub h3 a:before { position: absolute; top: -10px; left: -10px; right: -10px; bottom: -10px; background: #fff; content: ''; transform: translate3d(-100%, 0, 0) skewX(-16deg); transition: transform .3s cubic-bezier(.165, .84, .44, 1) } .footer .container .footer_sub h3 a:hover:before { transform: translateZ(0) skewX(-16deg) } .footer .container .footer_sub h3 a:hover { color: #333; } .footer .container .footer_sub h3 span{ position: relative} .footer .container .footer_sub h3 span em{ display: none; position: absolute; bottom:46px; right: 0px;} .footer .container .footer_sub h3 span:hover em{ display: block} .footer .container .footer_sub h3 span em img{ width: 150px; height: 150px;} .footer .container .footer_zx { height: 1px; width: 100%; background: #a93b2b; clear: both; } .footer .container .footer_d { color: #fff; text-align: center; line-height: 24px; padding-top: 15px; } .footer .container .footer_d a { color: #fff; } .ny_banner { height: calc(100vh - 110px); display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center center; } .ny_banner h2 { color: #fff; font-size: 70px; text-transform: uppercase; } .ny_dh { background: #f8f8f8; padding: 20px 0px; } .ny_dh .container { display: flex; justify-content: center; align-items: center; height: 100%; } .ny_dh .container .tb { position: relative; margin: 0px 2%; height: 100%; } .ny_dh .container .tb a { text-align: center; display: block; font-size: 12px; text-transform: capitalize; height: 100%; display: flex; flex-direction: column; justify-content: center; position: relative; } /* .ny_dh .container h2 a.on::after{ content: ''; width: 0px; height: 0px; position: absolute; bottom: -20px; left: 50%; transform: translate(-50%,0); border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:15px solid #fff;} */ .ny_dh .container a i { display: block; width: 50px; margin: 0px auto; margin-bottom: 3px; } .ny_dh .container a i img { width: 100%; height: auto; } .ny_dh .container a i img.white { display: block; } .ny_dh .container a i img.red { display: none; } .ny_dh .container a:hover i img.white { display: none; } .ny_dh .container a:hover i img.red { display: block; } .ny_dh .container a.on i img.white { display: none; } .ny_dh .container a.on i img.red { display: block; } .ny_dh .container a p { font-size: 14px; padding-top: 5px; } .ny_dh .container a.on p { color: #a93b2b; } .ny_dh .container .tb span { position: fixed; width: 100vw; left: 0px; justify-content: center; display: none; background: #f8f8f8; padding: 15px 0px; } .ny_dh .container .tb span a { line-height: 20px; width: auto; display: inline-block; margin: 0px 10px; color: #666; } .ny_dh1 .container { border-bottom: 1px solid #eee; padding: 15px 0px; text-align: center; } .ny_dh1 .container a { display: inline-block; line-height: 24px; width: auto; word-break: break-all; display: inline-block; margin: 0px 10px; color: #666; } .ny_dh1 .container a.on { color: #a93b2b; } .about { padding: 40px 0px; } .about .bt { text-align: center; } .about .bt h2 { font-size: 50px; text-transform: uppercase; color: #333; padding: 20px 0px; } .about .bt p { font-size: 16px; line-height: 30px; } .about ul { padding: 50px 0px; } .about ul li { display: flex; align-items: center; } .about ul li:nth-child(even) { flex-direction: row-reverse; } .about ul li .nr { width: 50%; padding: 5%; height: 100%; } .about ul li .nr p { font-size: 16px; line-height: 30px; } .about ul li .img { width: 50%; } .about ul li .img img { width: 100%; height: auto; } .about .bt1 p { font-size: 20px; line-height: 32px; text-align: center; } .about1_box { padding: 50px 0px; } .about1_box .bt { text-align: center; font-size: 50px; text-transform: uppercase; color: #333; padding-bottom: 20px; } .about1_box .container { display: flex; justify-content: space-between; align-items: center; } .about1_box .container .img { width: 45%; } .about1_box .container .img img { width: 100%; } .about1_box .container .nr { width: 50%; } .about1_box .container .nr h2 { font-size: 30px; font-weight: bold; color: #333; margin-bottom: 10px; } .about1_box .container .nr p { font-size: 16px; } .about1_box1 { background: url(../images/about_box1bj.png) no-repeat; background-size: 100% 60%; padding: 50px 0px; } .about1_box1 .bt { text-align: center; font-size: 50px; text-transform: uppercase; color: #fff; padding-bottom: 20px; } .about1_box1 .nr ul { display: flex; justify-content: space-between; } .about1_box1 .nr ul li { width: 33.3%; margin: 0px 2%; background: #f8f8f8; padding: 8% 5%; text-align: center; } .about1_box1 .nr ul li i { display: block; width: 80px; margin: 0px auto; } .about1_box1 .nr ul li i img { width: 100%; height: auto; } .about1_box1 .nr ul li i img.black { display: block; } .about1_box1 .nr ul li i img.white { display: none; } .about1_box1 .nr ul li p { font-size: 22px; font-weight: bold; color: #333; padding-top: 20px; } .about1_box1 .nr ul li:hover i img.black { display: none; } .about1_box1 .nr ul li:hover i img.white { display: block; } .about1_box1 .nr ul li:hover p { color: #a93b2b; } .about1_box2 { padding: 50px 0px; } .about1_box2 .bt { text-align: center; font-size: 50px; text-transform: uppercase; color: #333; padding-bottom: 20px; } .about1_box2_nr .swiper-wrapper { display: flex; align-items: center; } .about1_box2_nr .swiper-slide img { width: 100%; height: auto; } .about2_box1 { padding: 50px 0px; } .about3_box { padding: 50px 0px; background: url(../images/about3_boxbj.png) no-repeat; background-size: cover; } .about3_box .bt { text-align: center; } .about3_box .bt h2 { font-size: 50px; text-transform: uppercase; color: #fff; } .about3_box .bt p { font-size: 14px; line-height: 22px; color: #fff; } .about3_box .about3_box_nr { margin: 0px -10px; padding-top: 50px; display: flex; } .about3_box .about3_box_nr .swiper-slide { width: 50%; background: rgba(255, 255, 255, 0.8); padding: 5%; border-radius: 5px; } .about3_box .about3_box_nr .swiper-slide h2 { font-size: 24px; color: #333; font-weight: bold; margin-bottom: 20px; } .about3_box .about3_box_nr .swiper-slide p { font-size: 14px; line-height: 20px; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; } .about3_box .about3_box_nr .swiper-slide span { display: block; text-align: center; margin-top: 20px; } .about3_box .about3_box_nr .swiper-slide span a { display: inline-block; width: 170px; height: 45px; line-height: 45px; text-align: center; background: #881c22; color: #fff; font-size: 14px; } .about3_box1 { padding: 50px 0px; } .about3_box1 .bt { color: #333; font-size: 50px; text-transform: uppercase; text-align: center; } .about3_box1 .bt p{ text-align: center; font-size: 14px; text-transform: lowercase;} .about3_box1 ul { padding-top: 50px; margin: 0px -25px; flex-wrap: wrap; } .about3_box1 ul li { width: calc(50% - 50px); margin: 0px 25px; margin-bottom: 15px; float: left; } .about3_box1 ul li:nth-last-child(1) { width: 100%; margin: 0px; text-align: center; margin-top: 20px; } .about3_box1 ul li h2 { font-size: 16px; text-transform: uppercase; line-height: 40px; } .about3_box1 ul li h3 { display: flex; justify-content: space-between; } .about3_box1 ul li h3 .text { width: 100%; height: 60px; line-height: 60px; border: 1px solid #ddd; font-size: 16px; padding: 0px 10px; } .about3_box1 ul li h3 .text1 { width: 100%; height: 150px; line-height: 60px; border: 1px solid #ddd; font-size: 16px; padding: 0px 10px; } .about3_box1 ul li h3 .file { width: 100%; border: 1px solid #ddd; padding: 20px 10px; font-size: 14px; } .about3_box1 ul li h3 span { width: 48%; display: block; } .about3_box1 ul li h3 span b { font-size: 16px; text-transform: uppercase; line-height: 40px; font-weight: normal; } .about3_box1 ul li h3 p{ font-size: 14px; padding-top: 5px} .about3_box1 ul li .anniu { width: 170px; margin: 0px auto; height: 45px; line-height: 45px; text-align: center; background: #881c22; color: #fff; font-size: 14px; border: 0px; cursor: pointer; } .product_lb { padding: 50px 0px; } .product_lb ul { margin: 0px -30px; } .product_lb ul li { width: calc(33.3% - 60px); margin: 0px 30px; float: left; margin-bottom: 50px; } .product_lb ul li .img { overflow: hidden; } .product_lb ul li .img a { display: block; background-size: cover; } .product_lb ul li .img a:hover { transform: scale(1.1); } .product_lb ul li .img a img { width: 100%; height: auto; } .product_lb ul li h2 { font-size: 24px; height: 70px; word-break: break-all; color: #333; padding: 10px 0px; display: block; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical } .product_lb ul li h2 a { color: #333; } .product_lb ul li h2 a:hover { color: #a93b2b; } .product_lb ul li p { font-size: 14px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; height: 85px; } /*CSS sabrosus style pagination*/ DIV.sabrosus { padding: 5px; MARGIN: 25px 3px 25px 3px; TEXT-ALIGN: center; font-size: 14px; } DIV.sabrosus A { padding: 10px 20px; border: #ccc 1px solid; COLOR: #444; margin: 0px 3px; text-decoration: none; background: #fff; } DIV.sabrosus A:hover { padding: 10px 20px; background: #a93b2b; color: #fff; border: #a93b2b 1px solid; } DIV.pagination A:active { padding: 10px 20px; background: #a93b2b; color: #fff; MARGIN-RIGHT: 5px; border: #a93b2b 1px solid; } DIV.sabrosus SPAN.current { padding: 10px 20px; background: #a93b2b; color: #fff; border: #a93b2b 1px solid; } DIV.sabrosus SPAN.disabled { padding: 10px 20px; border: #ccc 1px solid; COLOR: #fff; MARGIN-RIGHT: 5px; text-decoration: none; } DIV.pagination1 { padding: 5px; MARGIN: 25px 3px 25px 3px; TEXT-ALIGN: center; font-size: 14px; display: flex; justify-content: center; } DIV.pagination1 A { padding: 10px 20px; border: #ccc 1px solid; COLOR: #444; margin: 0px 3px; text-decoration: none; background: #fff; } DIV.pagination1 A:hover { padding: 10px 20px; background: #a93b2b; color: #fff; border: #a93b2b 1px solid; } DIV.pagination1 A.cur { padding: 10px 20px; background: #a93b2b; color: #fff; MARGIN-RIGHT: 5px; border: #a93b2b 1px solid; } DIV.pagination1 p { padding: 10px 20px; background: #ddd; color: #fff; border: #ddd 1px solid; MARGIN-RIGHT: 5px; } DIV.pagination1 SPAN.disabled { padding: 10px 20px; border: #ccc 1px solid; COLOR: #fff; MARGIN-RIGHT: 5px; text-decoration: none; } .product_xx{ padding: 50px 0px;} .product_xx_box{ display: flex;} .product_xx_box_l{ width: 50%;} .product_xx_box_l .swiper-slide img{ width: 100%; height: auto;} .product_xx_box_l .swiper-pagination span { width: 6px; height: 20px; border: 1px solid #881c22; border-radius: 5px; opacity: 1; background: none; } .product_xx_box_l .swiper-pagination span.swiper-pagination-bullet-active { background: #881c22; } .product_xx_box_r{ width: 50%; padding: 5%;} .product_xx_box_r h2{ font-size: 36px; font-weight: bold; color: #333; word-break: break-all;} .product_xx_box_r h3{ font-size: 24px; display:block; padding: 25px 0px;} .product_xx_box_r p{ font-size: 14px;} .product_xx_box_r span{ display: block; padding-top: 30px;} .product_xx_box_r span a{ display: block; width: 310px; height: 75px; line-height: 75px; text-align: center; color: #333; background: #f8f8f8; margin-bottom:20px; font-size: 15px;} .product_xx_box_r span a i{ width: 24px; display: inline-block; vertical-align: middle; margin-left: 10px;} .product_xx_box_r span a i img{ width: 100%;} .product_xx_box_r span a i img.black {display: block;} .product_xx_box_r span a i img.white {display: none;} .product_xx_box_r span a:hover{ color: #881c22;} .product_xx_box_r span a:hover i img.black {display: none;} .product_xx_box_r span a:hover i img.white {display: block;} .product_xx_box_r span a:nth-last-child(1){ background: #881c22; color: #fff;} .product_xx_box_r span a:nth-last-child(1):hover{ opacity: .9;} .product_xx_box1{ padding-top: 50px;} .product_xx_box1 .bt{ font-size: 24px; color: #333; font-weight:bold; padding-bottom: 15px;} .product_xx_box1 ul li{ padding-left: 15px; position: relative; line-height: 28px; font-size: 13px; margin-bottom: 10px;} /*.product_xx_box1 ul li::after{ width: 5px; height: 5px; content: ''; background: #881c22; border-radius: 50%; left: 0px; top: 13px; position: absolute;}*/ .product_xx_box2{ padding-top: 50px;} .product_xx_box2 .bt{ font-size: 24px; color: #333; font-weight:bold; padding-bottom: 15px;} .product_xx_box2 .nr{ line-height: 26px; font-size: 14px;} .product_xx_box2 .nr img{ width: auto; max-width: 100%; height: auto;} .product_xx_box2 .nr table{ width: auto; max-width: 100%;} .product_xx_box2 .video{ width: 100%; height: auto;} .case_dh{ margin-top: -140px; background: none;} .case_dh .container .tb a{ color: #fff;} .case_dh .container .tb a:hover{ color: #881c22;} .case_box{ padding-top: 100px;} .case_box h3{ text-align: center;} .case_box h2{ font-size: 30px; color: #333; text-align: center; padding: 15px 0px;} .case_box p{ font-size: 16px; text-align: center;} .case_box1{ padding: 50px 0px;} .case_box1 .bt{font-size: 50px; text-transform: uppercase; text-align: center; color: #333;} .case_box1 .case_dh1{ border-bottom: 1px solid #ddd; line-height: 20px; padding: 20px 0px; display: flex;} .case_box1 .case_dh1 a{ flex: 1; text-align: center; font-size: 15px; color: #333; position: relative;} .case_box1 .case_dh1 a:hover{ color: #881c22;} .case_box1 .case_dh1 a.on{ color: #881c22;} .case_box1 .case_dh1 a:hover::after{ width: 60px; height: 2px; background: #881c22; content: ''; position: absolute; bottom: 0px; left: 50%; transform: translate(-50%,0);} .case_box1 .case_dh1 a.on::after{ width: 60px; height: 2px; background: #881c22; content: ''; position: absolute; bottom: 0px; left: 50%; transform: translate(-50%,0);} .news_banner{ height: 60vh; display: flex; align-items: center; justify-content: center;} .news_banner h2{ color: #fff; font-size: 50px; width: 100%; max-width:1000px; text-align: center;} .news_banner h1{ color: #fff; font-size: 50px; width: 100%; max-width:1000px; text-align: center;} .news_xx .container { background: #fff; margin-top: 50px; padding: 25px; margin-bottom: 50px; max-width: 1200px; } .news_xx .container .time{ margin-top: -20px; margin-bottom: 20px;} .news_xx .container .time span{ margin-right: 15px; font-size: 14px;} .news_xx .container p { margin-bottom: 15px; font-size: 15px; line-height: 30px; color: #333; } .news_xx .container img { max-width: 100%; width: auto; height: auto; } .news_xx .container table{ width: 100%;} .news_xx .news_xx_sx{ margin-top: 40px;} .news_xx .news_xx_sx ul li{ float: left; width: 100%; display: flex; justify-content: space-between; font-size: 14px; height: 40px; align-items: center;} .news_xx .news_xx_sx ul li h2{ width:120px; text-transform: uppercase;} .news_xx .news_xx_sx ul li a{ width: calc(100% - 100px); overflow: hidden; text-overflow:ellipsis; white-space: nowrap;} .news_xx .news_xx_sx ul li span{ font-size: 20px;} .jszc_r { width: calc(100% - 410px); } .jszc_r ul { margin: 0px -30px; } .jszc_r ul li { width: calc(25% - 60px); margin: 0px 30px; float: left; margin-bottom: 50px; } .jszc_r ul li .img { overflow: hidden; } .jszc_r ul li .img h3 { display: block; background-size: cover; transition: all 0.5s ease 0s; } .jszc_r ul li .img h3:hover { transform: scale(1.1); transition: all 0.5s ease 0s; } .jszc_r ul li .img h3 img { width: 100%; height: auto; } .jszc_r ul li h2 { font-size: 20px; word-break: break-all; color: #333; margin: 5px 0px; display: block; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical } .jszc_r ul li span{ display: block;} .jszc_r ul li span a { display: block; margin: 0px auto; width:100%; padding: 3px 0px; border: 1px solid #881c22; display: flex; color: #881c22; font-size: 13px; flex-direction: column; justify-content: center; align-items: center; text-transform: uppercase; } .jszc_r ul li span a:hover{ background:#881c22; color: #fff;} .jszc_r ul li span a i{ margin-bottom: 3px;} .jszc_r ul li span a i img{ width: 20px; height: auto;} .jszc_r ul li span a i img.black {display: block;} .jszc_r ul li span a i img.white {display: none;} .jszc_r ul li span a:hover i img.black {display: none;} .jszc_r ul li span a:hover i img.white {display: block;} .jszc_r1 { width:100%; } .jszc_r1 ul li{width: calc(20% - 60px);} .jszc1{ padding: 50px 0px;} .jszc1 .container{ display: flex; justify-content: space-between; align-items: end;} .jszc1 .container .jszc1_l{ width: 360px; background: #f8f8f8; padding: 2%;} .jszc1 .container .jszc1_l a{ display: block; font-size: 15px; line-height: 26px; padding: 10px 0px;} .jszc1 .container .jszc1_l a.on{ color: #881c22;} .jszc1 .container .jszc1_r{ width: calc(100% - 410px);} .jszc1 .container .jszc1_r .bt{ font-size: 32px; color: #881c22; padding-bottom: 20px;} .jszc1 .container .jszc1_r ul li{ border-bottom: 1px solid #ddd; padding: 20px 0px;} .jszc1 .container .jszc1_r ul li h2{ font-size: 22px; font-weight: bold; color: #333; padding-right: 210px; float: left;} .jszc1 .container .jszc1_r ul li h2 p b{ font-size: 13px; font-weight: normal; margin-right: 10%;} .jszc1 .container .jszc1_r ul li span{ float: right;} .jszc1 .container .jszc1_r ul li span a { display: block; margin: 0px auto; width: 200px; height: 52px; border: 1px solid #881c22; display: flex; color: #881c22; font-size: 16px; flex-direction: row; justify-content: center; align-items: center; text-transform: uppercase; } .jszc1 .container .jszc1_r ul li span a:hover{ background:#881c22; color: #fff;} .jszc1 .container .jszc1_r ul li span a i{ margin-left: 5px; width: 25px;} .jszc1 .container .jszc1_r ul li span a i img{ width: 100%;} .jszc1 .container .jszc1_r ul li span a i img.black {display: block;} .jszc1 .container .jszc1_r ul li span a i img.white {display: none;} .jszc1 .container .jszc1_r ul li span a:hover i img.black {display: none;} .jszc1 .container .jszc1_r ul li span a:hover i img.white {display: block;} .references{ padding: 50px 0px;} .references .references1{ margin-bottom: 20px;} .references .references1 .bt{ text-align: center; font-size: 20px; color: #fff; padding-bottom: 15px; text-transform: uppercase; font-weight: bold;} .references .references1 .bt span{ background: #881c22; display: inline-block; padding: 5px 20px; border-radius: 3px} .references .references1 ul{ margin: 0px -10px;} .references .references1 ul li{ width: calc(20% - 20px); margin: 0px 10px; float: left; margin-bottom: 20px;} .references .references1 ul li img{ width: 100%; height: auto; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); opacity: .6;} .references .references1 ul li:hover img{-moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); opacity: 1;} .ny_news { padding: 50px 0px; } .ny_news ul li { padding: 20px 0px; border-bottom: 1px solid #ddd; position: relative; } .ny_news ul li:hover{ box-shadow: 0px 0px 15px #ddd; background: #fff;} .ny_news ul li .img { width: 40%; overflow: hidden; box-shadow: 0px 0px 5px #999; float: left; } .ny_news ul li .img a { display: block; transform: scale(1); transition: all 0.5s ease 0s; background-size: cover; background-position: center center; } .ny_news ul li .img:hover a { transform: scale(1.1); transition: all 0.5s ease 0s; } .ny_news ul li .img img { width: 100%; height: auto; } .ny_news ul li .nr { width: calc(60% - 25px); float: right; padding: 20px 0px; } .ny_news ul li .nr h2 a { display: block; font-size: 22px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-bottom: 10px; } .ny_news ul li .nr h2 a:hover { color: #881c22; } .ny_news ul li .nr p { font-size: 14px; color: #999; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } .ny_news ul li .nr h3 { font-size: 14px; padding: 10px 0px; } .ny_news ul li .nr span { padding: 30px 0px; display: block; position: absolute; left: 42%; bottom: 0px; } .ny_news ul li .nr span a { display: inline-block; width: 170px; height: 45px; line-height: 45px; text-align: center; background: #881c22; color: #fff; font-size: 14px; } .ny_news ul li .nr span a:hover { opacity: .8; } .map{ width: 100%; height: 600px; margin-bottom: -50px; position: relative;} #map{ height: 100%; width: 100%;} .map_contact{ position: absolute; padding: 2%; top: 50%; left: 12%; transform: translate(0,-50%); background: #fff; width: 420px;} .map_contact h2{ color: #333; font-size: 20px; padding-bottom: 20px;} .map_contact h3{ display: flex; align-items: center; margin-bottom: 20px;} .map_contact h3 i img{ width: 25px;} .map_contact h3 p{ font-size: 14px; padding-left: 6px; line-height: 22px;} .join_tt{ padding: 5%} .join_tt p{font-size: 14px; line-height: 22px;} .about2_11{ padding: 50px 0px;} .about2_11 .container{ max-width: 1300px;} .event_box { position: relative; min-height: 400px; margin-top: 70px; } .event_box .parHd { width: 100%; display: inline-block; height: 92px; overflow: hidden; padding: 0px 70px; margin-top: 15px; } .parHd ul { width: 100%; text-align: center; margin: 0 auto; padding-top: 25px !important } .parHd .tempWrap { margin: 0 auto } .parHd .tempWrap:after { content: ''; width: 100%; height: 1px; background: #ddd; position: absolute; left: 0px; right: 0px; top: 10%; z-index: 10 } .parHd li.no_line:before { display: none } .parHd li { display: inline-block; cursor: pointer; padding-top: 20px; font-size: 20px; color: #999; width: 200px; position: relative } .parHd li:after { content: ''; background: #ddd; border-radius: 50%; width: 24px; height: 24px; position: absolute; z-index: 20; top: -12px; left: 50%; margin-left: -12px } .parHd li.act{ color: #000;} .parHd li.act:after{ background: #5284e7;} .parBd { text-align: center; margin-top: 60px } .parBd p { line-height: 32px; font-size: 15px; width: 100%; margin: 0 auto } div#listBox { width: 100% } .sPrev, .sNext { width: 60px; height: 60px; display: block; position: absolute; top: 10px; background: #ddd; border-radius: 50%; text-align: center; z-index: 100; } .sPrev i, .sNext i{ color: #666; font-size:40px; margin-top: 8px;} .sPrev { left: 0 } .sNext { right: 0 } .sPrev img, .sNext img { transition: all .6s cubic-bezier(.51, 1.1, .9, .95); -moz-transition: all .6s cubic-bezier(.51, 1.1, .9, .95); -webkit-transition: all .6s cubic-bezier(.51, 1.1, .9, .95); -o-transition: all .6s cubic-bezier(.51, 1.1, .9, .95) }