@CHARSET "UTF-8"; /*----- Common css ------*/ .fl { float: left; } .fr { float: right; } .di { _display: inline; } .fwn { font-weight: normal; } .dib { *display: inline; _zoom: 1; _display: inline; _font-size: 0px; } /*婊氬姩*/ #demo { overflow: hidden; width: 76%; margin: 0 auto; } #indemo { float: left; width: 800%!important; } #demo1 { float: left; } #demo2 { float: left; } #m_demo { overflow: hidden; width: 92%; margin: 0 auto; } #m_indemo { float: left; width: 800%!important; } #m_demo1 { float: left; } #m_demo2 { float: left; } .pos { position: relative; width: 1920px; left: 50%; margin-left: -960px; } .wh { max-width: 1260px; margin: 0 auto; padding: 0 30px; } .com-img { display: block; overflow: hidden; } .com-img img { transition: all 0.8s; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; } .com-img:hover img { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); } .roll_product { float: left; } .plist { margin-top: 56px; } .plist li { margin-right: 15px; margin-bottom: 15px; } .plist li:nth-child(3n) { margin-right: 0; } .plist li a.img { border: 1px solid #e5e5e5; display: block; } .plist li a.img img { width: 388px; height: 388px; } .plist li h3 a { display: block; color: #fff; font-size: 16px; font-weight: normal; } /*澶撮儴鏍峰紡*/ .top2 { position: fixed; top: 0; z-index: 999; height: 100px; border-bottom: 1px solid rgba(255, 255, 255, .2); width: 100%; } .logo { float: left; line-height: 100px; } /*鐑棬鎼滅储*/ .sou { border-top: 1px solid rgba(255, 255, 255, .2); padding-top: 4%; margin-top: 2%; } .sou #formsearch { float: right; } .sou .hotSearch { float: left; height: 54px; line-height: 54px; font-weight: normal; font-size: 14px; color: #5d5d5d; } .sou .hotSearch a { margin-right: 10px; color: #5d5d5d; } .sou .hotSearch .ppas a{margin-right:0px!important;} #search-type { float: left; width: 100px; height: 24px; border: 1px solid #c8c8c8; margin-right: 5px; } /*鎼滅储鍜岀儹闂ㄦ悳绱?/ .sou #formsearch input { height: 54px; background: transparent; border: none; line-height: 54px; } .sou #formsearch input#keyword { height: 54px; float: left; line-height: 54px; padding-left: 15px; color: #5d5d5d; border: 1px solid #5d5d5d; width: 367px; background: transparent; border-right: none; border-radius: 5px 0 0 5px; } .sou #formsearch input#s_btn { width: 144px; float: left; height: 54px; line-height: 54px; text-align: center; background-color: #11348e; color: #fff; border: none; cursor: pointer; font-size: 18px; border-radius: 0 5px 5px 0; } .sou #formsearch input::-webkit-input-placeholder { color: #5d5d5d; } .sou #formsearch textarea::-webkit-input-placeholder { color: #5d5d5d; } .mob-nav ul { padding-top: 13%; } .mob-nav ul li { width: 20%; } .mob-nav ul li>a { display: block; color: #fff; font-size: 20px; } .mob-nav ul li .sec { margin-top: 20px; } .mob-nav ul li .sec a { color: #fff; opacity: 0.5; font-size: 14px; display: block; line-height: 30px; } .mob-nav { z-index: 99999; position: fixed; left: 0; right: 0; top: 100px; bottom: 0; width: 100%; background: #202020; display: none; } .mob-nav.active { /*opacity: 1;*/ } .k2 .nav-btn { line-height: 100px; cursor: pointer; display: block; color: #fff; text-align: center; font-family: "arial"; text-transform: uppercase; background: url(../images/menu.png) no-repeat bottom center; } .close-btn { text-align: right; position: absolute; right: 30px; top: -69px; z-index: 9999; display: none; cursor: pointer; } .top2.cur { background: #202020; -webkit-transition: all .5s ease; transition: all .5s ease; } .logo2 { display: none; } .top2.cur .logo1 { display: none; } .top2.cur .logo2 { display: inline-block; } .mob-nav .wh { position: relative; } .top2.cur .k2 { display: none; } .gl { position: absolute; z-index: 999; left: 0; width: 100%; text-align: center; bottom: 20%; z-index: 99999; -webkit-animation: myfirst 1.5s infinite; animation: myfirst 1.5s infinite; } @-webkit-keyframes myfirst { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 50% { -webkit-transform: translate(0px, -10px); transform: translate(0px, -10px); } 100% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes myfirst { 0% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } 50% { -webkit-transform: translate(0px, -10px); transform: translate(0px, -10px); } 100% { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } } .section0 { position: relative; } .x-banner { height: 100vh; width: 100vw; } @media (max-width: 1700px) { .gl { bottom: 40%; } } @media (max-width: 1260px) { .gl { display: none; } } @media (max-width: 1024px) { .x-banner { height: auto; } .section1, .section2 { padding: 40px 0; } .fp-tableCell { height: auto !important; } .fp-section { height: auto !important; } #fp-nav { display: none; } } /* */ .section { position: relative; width: 100%; } .a2 { max-width: 1260px; margin: 0 auto; padding: 0 30px; } .section0 { background: #fff; } dt { font-weight: normal; } /* 鍏充簬鎴戜滑 */ .section1 { background: url(../images/bj1.jpg) no-repeat 50% 0; background-size: cover; } .abt { text-align: center; padding-top: 7%; } .abt dd { color: #ffffff; font-size: 36px; font-weight: bold; } .abt dt { font-size: 18px; color: #fff; background: url(../images/line1.png) no-repeat center; text-transform: uppercase; } .acon { color: #ffffff; font-size: 16px; margin: 0 auto; text-align: center; margin-top: 5%; line-height: 40px; width: 80%; } .aul { margin-top: 5%; } .aul li { width: 19%; text-align: center; margin: 0 7%; } .aul li a { display: block; margin: 0 auto; background: url(../images/fk1.png) no-repeat center; width: 215px; height: 215px; padding-top: 60px; background-size: 100% 100%; } .aul li .img { height: 56px; line-height: 56px; } .aul li .img2 { display: none; } .aul li:hover .img2 { display: inline-block; } .aul li:hover .img1 { display: none; } .aul li h3 { font-weight: normal; color: #ffffff; font-size: 14px; margin-top: 14px; } .aul li:hover a { background: url(../images/fk2.png) no-repeat center; background-size: cover; } .aul li:hover h3 { color: #11348e; } @media(max-width: 996px) { .aul li a { width: 180px; height: 180px; padding-top: 38px; } .acon { width: 100%; } } @media(max-width: 825px) { .aul li { width: 40%; margin: 0 5% 15px 5%; } .aul li a { margin: 0 auto; } } /* 浜у搧 */ .section { overflow: hidden; } .section2 { background: url(../images/bj2.jpg) no-repeat 50% 0; background-size: cover; } .cp {} .bt { color: #000000; font-size: 42px; text-align: center; font-weight: bold; line-height: 38px; } .bt span { color: #3264a0; font-size: 24px; display: block; background: url(../images/x3.png) no-repeat center bottom; padding-bottom: 15px; } .slick-arrow { background: none; outline: none; border: none; font-size: 0; } .section2 .slick-prev, .section2 .slick-next { width: 52px; height: 124px; position: absolute; top: 50%; margin-top: -62px; z-index: 99999; } .section2 .slick-prev { background: url(../images/lt.png) no-repeat top center; left: -82px; } .section2 .slick-next { background: url(../images/rt.png) no-repeat top center; right: -82px; } .product_list1 { margin-top: 5%; } .product_list1 li { _display: inline; position: relative; margin: 0 0.2%; } .product_list1 li h3 { text-align: center; line-height: 44px; font-weight: normal; color: #fff; font-size: 16px; background: #4c4c4c; } .product_list1 li .img img { width: 100%; display: block; } .picScroll-left { overflow: hidden; position: relative; } .pm { display: block; width: 238px; margin: 0 auto; height: 54px; border: 1px solid #aab7cd; line-height: 54px; font-size: 16px; position: relative; text-align: center; overflow: hidden; margin-top: 7%; } .pm a { color: #aab7cd; position: relative; z-index: 1; display: block; text-transform: uppercase; } @media(max-width: 768px) { .pm { width: 140px; height: 40px; line-height: 40px; } } /*妗堜緥*/ .section3 { background: url(../images/bj3.jpg) no-repeat 50% 0; background-size: cover; } .list22 { margin-top: 25px; margin-left: 38px; } .section3 .abt { position: absolute; width: 100%; z-index: 9999; } .yul { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; width: 100%; } .yul li { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } .yul li .bj1 { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-align: center; display: flex; justify-content: center; align-items: center; } .yul li .img { opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .yul li .img .bj { height: 100vh; } .bj1 h3 { color: #ffffff; font-size: 26px; } .bj1 span { display: block; color: #ffffff; opacity: 0.5; font-size: 14px; text-transform: uppercase; margin-top: 10px; } .bj1 a { display: none; } .yul li:hover .bj1 { background: rgba(17, 52, 142, .6); } .yul li:hover .bj1 a { display: block; margin-top: 117px; } .yul li:hover .img { opacity: 1; } .yul li .bj11 { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .yul li:hover .bj11 { margin-top: -30px; } .yul li .img img { display: block; width: 100%; } @media(max-width: 1200px) { .bj1 h3 { font-size: 20px; } .bj1 span { font-size: 12px; } } /* 鑽h獕璧勮川 */ .section4 { background: url(../images/bj4.jpg) no-repeat 50% 0; background-size: cover; } .tab1 { display: none; } .nsort { text-align: center; margin-top: 5%; } .nsort li { float: left; width: 25%; } .nsort li a { display: block; border-right: 1px solid #f0f0f0; line-height: 54px; background: #fff; color: #333333; font-size: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nsort li:last-child a { border-right: none; } .nsort li.cur a { background: #11348e; color: #fff; } .nlist { margin-top: 5%; } .nlist li { width: 22.75%; margin-right: 3%; } .nlist li:last-child { margin-right: 0; } .nlist li a.img img { display: block; width: 100%; } .nlist li a.img { display: block; position: relative; } .nlist li a.img span { display: block; position: absolute; width: 90px; height: 20px; line-height: 20px; text-align: center; color: #11348e; background-color: #ffffff; bottom: 10px; left: 11px; } .nlist li h3 a { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; color: #333333; font-size: 16px; font-weight: normal; padding: 10% 3px; background: #fff; text-align: center; } .nmore a { display: block; color: #fff; width: 192px; height: 36px; background-color: #11348e; border-radius: 18px; margin: 0 auto; text-align: center; line-height: 36px; margin-top: 8%; } /* 鏂伴椈 */ .section5 { background: url(../images/bj5.jpg) no-repeat 50% 0; background-size: cover; } .lxwm { width: 80%; margin: 0 auto; margin-top: 5%; background: rgba(255, 255, 255, .2); padding: 3% 5%; display: flex; align-content: space-between; flex-wrap: nowrap; display: -webkit-flex; } .tleft { width: 46%; padding-right: 3%; } .map { width: 54%; } .map img { max-width: 100%!important; width:auto!important; height:auto!important; } .tleft h3 { color: #fff; font-weight: normal; font-size: 24px; line-height: 30px; } .lx { color: #ffffff; font-size: 14px; line-height: 32px; margin-top: 3%; } .asort { text-align: center; margin-top: 5%; } .asort li { display: inline-block; margin: 0 2%; width: 15%; } .asort li a { display: block; height: 44px; border-radius: 22px; border: solid 1px rgba(255, 255, 255, .5); line-height: 44px; color: #e1e1e3; font-size: 16px; } .yul2 { display: none; } @media(max-width: 769px) { .yy { background: rgba(17, 52, 142, .6); padding: 10px 0; } .abt dd { font-size: 26px; } .abt dt { font-size: 14px; margin-top: 5px; } .acon { font-size: 16px; line-height: 28px; } .section3 .abt { position: static; } .yul { display: none; } .yul2 { display: block; padding: 0 30px; margin-top: 20px; } .yul2 li { width: 46%; float: left; margin: 0 2% 20px 2%; } .yul2 li h3 { color: #fff; text-align: center; font-size: 16px; font-weight: normal; margin-bottom: 5px; } .yul2 li span { color: #fff; text-align: center; display: block; font-size: 12px; text-transform: uppercase; } .yy a { text-align: center; margin-top: 15px; display: block; } } @media(max-width:540px) { .acon { font-size: 14px; line-height: 24px; } .aul li a { width: 140px; height: 140px; padding-top: 25px; } .aul li h3 { margin-top: 0px; } .aul li .img img { width: 23%; } } @media(max-width:370px) { .aul li a { width: 120px; height: 120px; padding-top: 25px; } .aul li h3 { margin-top: 3px; font-size: 12px; } .aul li .img { height: 38px; line-height: 38px; } .aul li .img img { width: 23%; } } #fp-nav {} @media(min-width: 769px) { .sun-delay0 { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } .sun-delay1 { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .sun-delay2 { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; } .sun-delay3 { -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .sun-delay4 { -webkit-transition-delay: 1s; transition-delay: 1s; } .sun-delay5 { -webkit-transition-delay: 1.2s; transition-delay: 1.2s; } .sun-delay6 { -webkit-transition-delay: 1.4s; transition-delay: 1.4s; } .sun-delay7 { -webkit-transition-delay: 1.6s; transition-delay: 1.6s; } .sun-delay8 { -webkit-transition-delay: 1.8s; transition-delay: 1.8s; } .sun-delay9 { -webkit-transition-delay: 2s; transition-delay: 2s; } .sun-delay10 { -webkit-transition-delay: 2.2s; transition-delay: 2.2s; } .sun-ani-left, .sun-ani-down, .sun-ani-up, .sun-ani-right { opacity: 0; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .7s; transition-duration: .7s; } .sun-ani-left { -webkit-transform: translateX(-100px); transform: translateX(-100px); } .sun-ani-down { -webkit-transform: translateY(-100px); transform: translateY(-100px); } .sun-ani-up { -webkit-transform: translateY(-200px); transform: translateY(200px); } .sun-ani-right { -webkit-transform: translatex(100px); transform: translatex(100px); } .actives .sun-ani-left { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .active .sun-ani-left { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .active .sun-ani-down { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .active .sun-ani-up { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .active .sun-ani-right { opacity: 1; -webkit-transform: translatex(0); transform: translatex(0); } } /*椤甸潰搴曢儴*/ .bq { border-top: 1px solid #777f98; color: #b0b3be; font-size: 12px; text-align: center; padding: 5px 0; line-height: 24px; margin-top: 6%; } .bq a { color: #b0b3be; } .f_link { padding: 15px 0; line-height: 30px; color: #666; font-size: 14px; } .f_link a { color: #666; padding-right: 10px; } @media(max-width:1200px) { .tleft h3 { font-size: 16px; } .lx { font-size: 13px; line-height: 26px; } } @media(max-width:992px) { .x-banner, .page-banner { margin-top: 60px; } } @media(max-width:800px) { .nsort li a { font-size: 14px; line-height: 40px; } .nlist li h3 a { font-size: 14px; } .lxwm { width: 100%; } .tleft h3 { font-size: 20px; } } @media(max-width:700px) { .lxwm { display: block; } .tleft { margin-bottom: 20px; } .tleft, .map { width: 100%; } .asort li { width: 26%; } .lx { font-size: 12px; line-height: 24px; } .asort li a { font-size: 14px; line-height: 38px; height: 38px; } .nlist li { width: 46%; margin: 0 2% 20px 2%; } .nlist li { margin-right: 2%; } .nlist li h3 a { padding: 5% 3px; } .tleft h3 { font-size: 20px; } } .footer2 { text-align: center; color: #fff; line-height: 24px; background: #666; padding: 10px 0; } .footer2 a { color: #fff; } @media(max-width:1024px) { .section4 { padding-bottom: 30px; } .aul { margin-top: 2%; } .acon { margin-top: 2%; } .ling .abt { padding-top: 12%; } .abouts .abt { padding-top: 10%; } } /* 鎵嬫満椤佃剼 */ .footer { position: fixed; bottom: 0; left: 0; right: 0; z-index: 999; background: #434343; } .footer ul { display: -webkit-box; display: -ms-flexbox; display: flex; } .footer ul li { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; color: #ffffff; line-height: 50px; font-size: 0; } .footer ul li a { display: block; color: #ffffff; } .footer ul li .iconfont { font-size: 14px; display: inline-block; vertical-align: middle; margin-right: 5px; } .footer ul li span { display: inline-block; vertical-align: middle; font-size: 15px; color: #ffffff; }