锘?***********閫氱敤鍩烘湰绫?************/ /*鏍煎紡鍖栨牱寮?/ * { margin: 0; padding: 0; } address, cite, dfn, em, var, i { font-style: normal; } table { border-collapse: collapse; border-spacing: 0; } h1, h2, h3, h4, h5, h6, th { font-size: 100%; font-weight: normal; } button, input, select, textarea { font-size: 100%; } fieldset, img { border: 0; max-width: 100%; } a { text-decoration: none; color: inherit; background: none } a:hover { color: #b80000; } ul, ol { list-style: none; } i, strong, em, b { font-style: normal; } /*缁撴瀯鏍峰紡*/ .p10 { padding-left: 10px; padding-right: 10px; } .marginTop { margin-top: 3%; } @media (max-width: 768px) { .marginTop { margin-top: 5%; } } /***********閫氱敤鍩烘湰绫?************/ body { font-size: 14px; line-height: 1.5; font-family: 'Microsoft Yahei', 'simsun', 'arial', 'tahoma'; max-width: 1920px; margin-left: auto; margin-right: auto; color: #000; } .wrap { width: 100%; max-width: 1920px; margin-left: auto; margin-right: auto; } .main { width: 100%; max-width: 1600px; margin-left: auto; margin-right: auto; box-sizing: border-box; } @media (max-width: 1600px) { .main { padding-left: 30px; padding-right: 30px; } } @media (max-width: 768px) { .main { padding-left: 15px; padding-right: 15px; } } .m{ display: none; } @media (max-width: 768px) { .pc{ display: none !important; } .m{ display: block; } .main2 { padding-left: 10px; padding-right: 10px; } } /* 鍗曡鏂囧瓧瓒呭嚭闅愯棌 */ .ellipsis { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } /* 娓呯悊娴姩 */ .fn-clear:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .fn-clear { zoom: 1; /* for IE6 IE7 */ } .floatL { float: left; } .floatR { float: right; } .overflowH { overflow: hidden; } /* 鍝嶅簲寮忓浘鐗囩洅瀛 */ .imgBox { position: relative; } .imgBox img { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .imgBox img.full { width: 100%; height: 100%; } .imgBox img.auto { max-width: 100%; max-height: 100%; } /* 鍥剧墖鏀惧ぇ */ .hoverScale { overflow: hidden; } .hoverScale img { -webkit-transition: .4s; transition: .4s; backface-visibility: hidden; } .hoverScale:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .middleBox:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; } .middleLi { display: inline-block; vertical-align: middle; } /***********鍏朵粬鍏叡鏍峰紡************/ /*ao-椤堕儴鏍忕洰*/ .ao-headerNav .item1 > li { position: relative; height: 100%; text-align: center; font-size: 15px; float: left; margin: 0px 20px; } .ao-headerNav .item1>li>a { position: relative; display: block; } .ao-headerNav .item2 { display: none; position: absolute; top: 100%; left: 50%; z-index: 2; font-size: 14px; line-height: 3em; text-align: center; min-width: 100%; background-color: #fff; border: 1px solid #e0e0e0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; } .ao-headerNav .item1>li:hover .item2 { display: block; } @media (max-width: 1600px) { .ao-headerNav .item1 > li { font-size: 14px; } } @media (max-width: 1200px) { .ao-headerNav { display: none; } } /*椤堕儴鏍忕洰end*/ /*ao-鍝嶅簲寮忛《閮ㄦ爮鐩?鎸夐挳*/ .ao-navBtn .navbar-toggle { position: relative; padding: 9px 10px; background-color: transparent; background-image: none; cursor: pointer; outline: none; border: 1px solid #ddd; border-radius: 6px; } .ao-navBtn .navbar-box .sr-only { display: block; width: 100%; padding: 0; margin: -1px; font-size: 12px; line-height: 1.4; overflow: hidden; border: 0; color: #888; text-align: center; margin-top: 2px; } .ao-navBtn .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; background-color: #888; } .ao-navBtn .navbar-toggle .icon-bar+.icon-bar { margin-top: 4px; } /*鍝嶅簲寮忛《閮ㄦ爮鐩?鎸夐挳end*/ /* header澶撮儴 */ .header { width: 100%; position: fixed; top: 0; left: 0; z-index: 222222; transition: 0.4s; } .header.on { background: #fff; box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important; } .header.on .header_nav { color: #000; } .header .header_tel .icon a { transition: 0.6s; } .header .header_tel .icon a:hover { transform: translateY(-10px); } .header .header_tel .icon a .mi.m2 { display: none; } .header.on .header_tel .icon a .mi { background: #fff; border: 1px #ddd solid; display: none; } .header.on .header_tel .icon a .mi.m2 { display: block; } .header.on .header_nav li a:hover { color: #333; } .header.on .header_nav .item1>li:after { background-color: #b28b6e; } .header.on .header_main .header_tel .ttt { color: #000; } .header.on .header_main .header_tel .ttt img{ display: none; } .header.on .header_main .header_tel .ttt img.t2 { display: block; } .header .header_main { height: 110px; transition: 0.6s; padding: 0 4%; } @media (max-width: 1670px) { .header .header_main { width: 100%; max-width: 1600px; margin-left: auto; margin-right: auto; box-sizing: border-box; padding: 0; } } @media (max-width: 1600px){ .header .header_main { padding-left: 30px; padding-right: 30px; } } @media (min-width: 1200px) { .header.on .header_main { height: 80px; } .header.on .header_nav { height: 80px; line-height: 80px; } } .top_line { background: #686868; height: 36px; line-height: 36px; font-size: 12px; overflow: hidden; } .top_line, .top_line a { color: #fff; } .top_line .welcome { float: left; } .top_line .topBtn { float: right; } .header .logo { float: left; font-size: 0; } .header .logo { height: 100%; display: flex; align-items: center; } .header .logo img { max-height: 90%; } .header_main .header_tel { float: right; line-height: 1.2; height: 100%; display: flex; align-items: center; padding-left: 20px; } .header_main .header_tel .ttt { margin-right: 20px; color: #fff; font-size: 16px; display: flex; align-items: center; } .header_main .header_tel .ttt img{ margin-right: 10px; } .header_main .header_tel .ttt img.t2{ display: none; } .header_tel .icon { display: flex; justify-content: end; align-items: center; height: 100%; } .header_tel .icon a { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: 13px; position: relative; } .header_tel .icon a .mi { width: 28px; border-radius: 50%; padding: 8px; background-color: rgba(255,255,255,0.3); } .header_tel .icon a span { margin-top: 15px; } .header_tel .icon a:hover .mi { background-color: #2b884c !important; display: block !important; } .header_tel .icon a:hover .mi.hei { background-color: #000 !important; } .header_tel .icon a:hover .mi.m2 { display: none !important; } .header_tel .icon a .i { position: absolute; width: 100px; height: 100px; top: 100%; left: 50%; margin-left: -50px; margin-top: 10px; display: none; transition: 0.4s; border: 1px solid #ccc; } .header_tel .icon a .i img { width: 100%; height: 100%; } .header_tel .icon a:hover .i { display: block; } .header_main .header_tel .phoneIco, .header_main .header_tel .telInfo { display: table-cell; vertical-align: middle; text-align: left; } .header_main .header_tel .phoneIco i { display: inline-block; width: 4em; height: 4em; background: url("../Images/phoneIco.png") no-repeat center center / contain; margin-right: 20px; } .header_main .header_tel .telInfo .telText { font-size: 20px; color: #fff; margin-bottom: 5px; } .header_main .header_tel .telInfo .telNum { font-size: 22px; color: #00479d; } .header_main .header_tel .telInfo .telNum a { color: #fff; font-size: 36px; } .header .icoBtn { float: right; height: 100%; display: none; } .header .icoBtn .navbar-box { display: inline-block; vertical-align: middle; } @media (max-width: 1320px) { .header_main .header_tel { display: none; } } @media (max-width: 1200px) { .header { position: fixed; top: 0; left: 0; z-index: 44; } body { padding-top: 80px; } .header .header_main { height: 80px; } .header .icoBtn { display: flex; align-items: center; } } @media (max-width: 992px) { body { padding-top: 80px; } .header .header_main { height: 80px; } .header .logo { max-width: 70%; } .header .logo img { max-height: 60%; max-width: 100%; } } @media (max-width: 900px) { .header_main .header_tel { display: none; } } @media (max-width: 768px) { body { padding-top: 65px; } .header .header_main { height: 65px; } .top_line { height: 24px; line-height: 24px; } .top_line .welcome { float: none; text-align: center; font-size: 12px; } .top_line .topBtn { display: none; } } /* nav */ .header_nav { color: #fff; height: 110px; line-height: 110px; float: left; margin-left: 4%; } .header_nav li { height: 100%; font-size: 14px; position: relative; } .header_nav li a:hover { color: #fff; } .header_nav .item1>li:after { -webkit-backface-visibility: hidden; backface-visibility: hidden; content: ""; position: absolute; left: 50%; bottom: 50%; margin-bottom: -1.5em; width: 0; height: 1px; background: #fff; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .header_nav .item1>li:hover:after { width: 95%; } .header_nav .item1>.on:after { width: 95%; } @media (max-width: 1500px) { .header_nav { margin-left: 4%; } .header_tel .icon { display: none; } } /* nav end*/ /* 绉诲姩绔晶瀵艰埅 */ .ao-navMask { position: fixed; width: 80%; height: 100%; top: 0; left: -80%; background-color: rgba(0, 0, 0, .8); z-index: 2222; -webkit-transition: all 0.5s; transition: all 0.5s; } .ao-slideNav { -webkit-box-sizing: border-box; box-sizing: border-box; visibility: visible; position: fixed; top: 0; right: -20%; width: 20%; height: 100%; background-color: #fff; -webkit-transition: all 0.5s; transition: all 0.5s; z-index: 2222; } .ao-navMask.on { left: 0; } .ao-slideNav.on { right: 0; } .ao-slideNav .btn { background: url("../Images/slide-close.png") no-repeat center center / cover; width: 20px; height: 20px; margin-left: auto; margin-right: 15px; margin-top: 15px; cursor: pointer; } .ao-slideNav li { width: 100%; border-left: 0; line-height: 1.8; border-bottom: 1px solid #dee2e6; } .ao-slideNav li a { display: block; padding: 12px 32px 12px 20px; } .ao-slideNav .item1>li { font-size: 16px; color: #8B8784; } .ao-slideNav .item2 { display: none; } @media (max-width: 992px) { .ao-slideNav { right: -30%; width: 30%; } .ao-navMask { width: 70%; } } @media (max-width: 768px) { .ao-slideNav { right: -50%; width: 50%; } .ao-navMask { width: 50%; } } /* footer鑴氶儴 */ .footer { padding: 3% 0; color: #fff; margin-top: 4%; background-color: #093a86; } .footer a { color: #fff; } .footer .fl { float: left; } .footer .info { float: right; } .footer .nav { float: left; } .footer .nav.code .ccc { float: left; width: 100px; margin-right: 10px; text-align: center; } .footer .nav.code .ccc img { width: 100%; height: 100%; } .footer .nav.code .ccc span { width: 100%; height: 100%; } .footer .nav .item1>li { position: relative; font-size: 18px; float: left; margin-right: 45px; } .footer .nav.code .item1 > li:last-child { margin-right: 0 !important; } .footer .nav .item2 { padding-top: 15px; } .footer .nav .item2 li { margin-top: 1em; font-size: 14px; text-align: left; } .footer .nav .item2 li a { color: rgba(255, 255, 255, .5); } .footer .info { text-align: right; } .footer .info .hotTel { font-size: 16px; } .footer .info .hotNum { font-size: 42px; margin-bottom: 0.5em; font-weight: bold; } .footer .info .hotNum a { color: #b28b6e; } .footer .info .icon { display: flex; justify-content: end; margin-top: 40px; } .footer .info .icon a { margin-left: 25px; position: relative; text-align: center; transition: 0.6s; } .footer .info .icon a .mi { width: 24px; border-radius: 50%; background-color: rgba(255, 255, 255, 0.5); padding: 10px; } .footer .info .icon a span { margin-top: 15px; display: block; } .footer .info .icon a:hover .mi { background-color: #2b884c; } .footer .info .icon a:hover .mi.hei { background-color: #000; } .footer .info .icon a .i { position: absolute; width: 100px; height: 100px; bottom: 100%; left: 50%; margin-left: -50px; margin-bottom: 4px; display: none; transition: 0.4s; } .footer .info .icon a .i img { width: 100%; height: 100%; } .footer .info .icon a:hover { transform: translateY(-10px); } .footer .info .icon a:hover .i { display: block; } .footer .companyInfo { margin-bottom: -3%; margin-top: 10px; color: rgba(255,255,255,0.3); border-top: 1px solid rgba(255,255,255,0.3); padding: 1.5em 0; } .footer .companyInfo a{ color: rgba(255,255,255,0.3); } .footer .companyInfo span { margin-right: 0.5em; } @media (max-width: 1280px) { .footer .nav .item1>li { font-size: 16px; margin-right: 30px; } .footer .info .hotNum { font-size: 30px; } } @media (max-width: 1060px) { .footer .nav .item1>li { font-size: 14px; margin-right: 15px; } .footer .nav .item2 li { font-size: 12px; } .footer .info .hotNum { font-size: 22px; } .footer .nav.code .ccc { width: 70px; } } @media (max-width: 768px) { .footer .nav { display: none; } .footer .info { float: none; } .footer .companyInfo span { display: block; text-align: center; font-size: 12px; margin-right: 0; } .footer .info .il { float: left; text-align: left; } .footer .info .hotTel { font-size: 14px; margin-top: 10px; } .footer .info .hotNum { font-size: 20px; } .footer .info .icon { margin-top: 0; float: right; } .footer .info .icon a { margin-left: 10px; } .footer .info .icon a .mi { width: 18px; } .footer .info .icon a span { margin-top: 4px; } .footer { border-top: 1px solid #fff; padding-top: 40px; } } /*swiper*/ .swiper-button-prev, .swiper-button-next { position: absolute; left: 1%; top: 50%; margin-top: -25px; display: block; width: 32px; height: 40px; background: url(../Images/slider-arrow.png) -110px 5px no-repeat; filter: alpha(opacity=50); opacity: 0.5; } .swiper-button-next { left: auto; right: 1%; background-position: 8px 5px; } .swiper-button-prev:hover, .swiper-button-next:hover { filter: alpha(opacity=100); opacity: 1; } /* lignhtBox */ #wrap { position: absolute; left: 50%; top: 50%; -webkit-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); } #mask { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 1000; background: #292929; opacity: 0.5; filter: alpha(opacity=50); display: none; } .photo_border { width: 300px; height: 300px; position: fixed; left: 50%; margin-left: -150px; z-index: 1001; background: url(../Images/lightbox/loading.gif) no-repeat center center #fff; display: none; z-index: 1000; zoom: 1; } .photo { position: relative; border: 5px solid #fff; border-radius: 3px; overflow: hidden; } .photo_btn { display: block; position: absolute; height: 100%; width: 40%; top: 0; zoom: 1; background: url(../Images/lightbox/ie-bug.gif); cursor: pointer; } .photo_pre_btn { left: 0; } .photo_pre_btn_show { background: url(../Images/lightbox/prev.png) no-repeat; background-position: 10% center; } .photo_next_btn { right: 0; } .photo_next_btn_show { background: url(../Images/lightbox/next.png) no-repeat; background-position: 90% center; } .caption { position: relative; top: -65px; width: auto; height: 60px; margin: 0 5px; display: block; background: rgba(126, 126, 126, 0.5); } .photo_border .index { padding-left: 10px; color: #000; height: 30px; line-height: 30px; } .photo_border .title { padding-left: 10px; height: 30px; line-height: 30px; color: #fff; } .caption_close_btn { width: 27px; height: 27px; position: absolute; right: 10px; top: 13px; background: url(../Images/lightbox/close.png) no-repeat; cursor: pointer; } /* lignhtBox end*/ .goTop { position: fixed; bottom: 10%; right: 0; width: 3.6em; height: 3.6em; border-radius: 50%; background: #c9c9c9 url('../Images/go-top.png') no-repeat center center / 60% 60%; z-index: 34; opacity: 0.8; } .goTop img { width: 100%; height: 100%; } .goTop:hover { background-color: #b80000; opacity: 1; } /*瀹㈡埛 end*/ .friendsLinks_content { color: rgba(255, 255, 255, .5); margin-top: 4%; } .friendsLinks_content .main { -webkit-box-sizing: border-box; box-sizing: border-box; } .friendsLinks_content a { font-size: 14px; color: rgba(255, 255, 255, .5); margin-right: 1.5em; } @media (max-width: 768px) { .friendsLinks_content { display: none; } .friendsLinks_content .main { padding: 15px 15px; -webkit-box-sizing: border-box; box-sizing: border-box; } .friendsLinks_content span, .friendsLinks_content a { font-size: 10px; } } .fApp { text-align: center; margin-top: 30px; } .fApp ul{ display: flex; justify-content: center; } .fApp .fat { font-size: 15px; color: #f1cba3; font-weight: bold; margin-bottom: 10px; } .fApp li { width: 100px; margin: 0 15px; } .fApp li img{ width: 100%; } .swiper-button-prev, .swiper-button-next { line-height: 40px; width: auto; color: #fff; font-weight: bold; padding: 0 10px; background: none; } .swiper-button-prev:before, .swiper-button-prev:after, .swiper-button-next:before, .swiper-button-next:after { content: ''; position: absolute; width: 2px; height: 50%; background: #fff; transition: all 0.5s; } .swiper-button-prev:before, .swiper-button-prev:after { left: 0; } .swiper-button-next:before, .swiper-button-next:after { right: 0; } .swiper-button-prev:before, .swiper-button-next:before { top: 0; } .swiper-button-prev:after, .swiper-button-next:after { bottom: 0; } .swiper-button-next:hover:before { -webkit-transform: rotate(-45deg); top: 4px; } .swiper-button-next:hover:after { -webkit-transform: rotate(45deg); bottom: 4px; } .swiper-button-prev:hover:before { -webkit-transform: rotate(45deg); top: 4px; } .swiper-button-prev:hover:after { -webkit-transform: rotate(-45deg); bottom: 4px; } @media (max-width: 768px) { .swiper-button-prev, .swiper-button-next { display: none; } }