img{ max-width: 100%; } *{ box-sizing: border-box; } .bg-color { background: #fff; } .top_bar { font-size: 13px; height: 34px; line-height: 34px; background: #eeeeee; color:#666666; } .top_bar .tb-left { float: left; height: 34px; overflow: hidden; } .top_bar .tb-left a { font-size: 13px; color: #b70c0c; } .top_bar .tb-left a:hover { color: #ffb700; } .top_bar .tb-rig { float: right; } .top_bar .tb-rig ul li { position: relative; float: left; font-size: 13px; } .top_bar .tb-rig ul li > a { color: #666666; padding: 0px 22px; } .top_bar .tb-rig ul li > a:hover { color: #ffb700; } .top_bar .tb-rig ul li .drop-list { display: none; position: absolute; top: 40px; padding: 10px 0 8px; left: 0; right: 0; z-index: 2; background: rgba(246, 246, 247, 0.95) !important; filter: alpha(opacity=95); background: #f6f6f7; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; box-shadow: 1px 3px 3px #ccc; } .top_bar .tb-rig ul li .drop-list ul li { float: none; line-height: 32px; } .top_bar .tb-rig ul li .drop-list ul li a { display: block; text-align: center; padding: 0; } .top_bar .tb-rig ul li.drop-down:hover > a { color: #268ae7; } .top_bar .tb-rig ul li.drop-down:hover .drop-list { display: block; } .head { height: 130px; background: #fff; } .head .logo{ margin-top: 30px; overflow: hidden; width: 70%; } .head .logo img { display: inline-block; vertical-align: middle; max-width:100%; max-height:100%; } .head .logo .logo_right_text{ padding: 0 0 0 1%; margin-left: 1%; border-left: 1px solid #DDDDDD; font-size: 16px; display: flex; align-items: center; min-width: 240px; } .head .logo .logo_right_text strong{ color: #448CFD; } .head .logo .logo_right_text p:last-child{ font-weight: bold; } .head_group{ margin-top: 40px; } .head_group img{ margin:15px 10px 0 0; } .head_group p.t{ font-size: 14px; color: #7E7E7E; font-weight: normal; } .head_group p{ font-size: 24px; color:#448CFD; font-weight: bold; line-height: 26px; } .nav-bar{ background: #448CFD; } .nav-bar ul li a{ color: #fff; display: block; width: 100%; height: 100%; } .nav-bar ul li{ width: calc(100%/7); height: 60px; line-height: 60px; text-align: center; color: #fff; transition: all .5s ease; font-size: 16px; } .nav-bar ul li.active, .nav-bar ul li:hover{ background: #ffb700; } .swiper-container{ position: relative; overflow: hidden; } body .swiper-button-next, body .swiper-button-prev{ width: 50px; height: 50px; background: #ccc; border-radius: 50%; } body .swiper-button-next:hover, body .swiper-button-prev:hover{ background: #448CFD; } body .swiper-button-next::after, body .swiper-button-prev::after{ font-size: 14px; color: #fff; } /*公共title*/ .global_title{ padding-top: 70px; position: relative; text-align: center; } .global_title .h3_en{ position: absolute; width: 100%; text-transform: uppercase; font-weight: bold; font-size: 70px; font-family: 'Impact'; left: 0px; top: 43px; z-index: 0; color: #E8E8E8; } .global_title h3{ font-size: 36px; font-weight: bold; position: relative; z-index: 1; } .global_title h3 strong{ color: #448CFD; } .global_title p.des{ position: relative; z-index: 1; font-size: 16px; margin:5px 0; } .global_title span{ display: inline-block; width: 30px; height: 1px; border:1px solid #448CFD; margin:10px auto 20px; } /*产品*/ .pro_index{ background: #f5f5f5; padding-bottom: 50px; } /*下拉菜单*/ .accordion-menu { width: 270px; background: #fff; height: 100%; } .accordion-menu .title{ background: #448CFD; color: #fff; padding: 25px 40px; } .accordion-menu .title h3{ font-size: 30px; font-weight: bold; } .accordion-menu .title p{ font-size: 12px; } .accordion-menu li.open .dropdownlink { color: #448CFD; font-weight: bold; } .accordion-menu li.open .dropdownlink .fa-chevron-down { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .accordion-menu li:last-child .dropdownlink { border-bottom: 0; } .dropdownlink { cursor: pointer; display: block; padding: 15px 15px 15px 40px; font-size: 15px; border-bottom: 1px solid #f5f5f5; color: #212121; position: relative; -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .dropdownlink i { position: absolute; top: 21px; left: 16px; } .dropdownlink .fa-chevron-down { right: 12px; left: auto; } .submenuItems { display: none; } .submenuItems li { border-bottom: 1px solid #f5f5f5; } .submenuItems a { display: block; color: #727272; padding: 12px 12px 12px 55px; -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; font-size: 15px; } .submenuItems a:hover { color: #448CFD; } .accordion-menu .bot{ padding: 30px 20px; color: #fff; background: #458DFE; height: 110px; } .accordion-menu .bot img{ float: left; margin-right: 10px; } .accordion-menu .bot h4{ font-size: 24px; font-weight: bold; } .pro_list .inner{ width: 900px; } .pro_list .inner ul li{ width: 290px; margin-right: 10px; background: #fff; height: 255px; margin-bottom: 10px; } .pro_list .inner ul li .cici{ height: 210px; } .pro_list .inner ul li h4{ display: block; height: 40px; line-height: 40px; text-align: center; } .pro_list .inner ul li:hover h4{ color: #458DFE; font-weight: bold; } .pro_list .inner ul li:hover img{ transform: scale(1.05); } /*企业优势*/ .adv{ background: url(../images/adv.jpg) no-repeat top; } .adv .title{ text-align: center; color: #fff; text-transform: uppercase; padding-top: 70px; margin-bottom: 30px; } .adv .title img{ margin:0 auto; } .adv .title h3{ font-size: 32px; font-weight: bold; } .adv .title p{ font-size: 12px; } .adv .swiper-slide{ background: #fff; border:2px solid #E2E2E2; } .adv .box{ position: relative; } .adv .swiper-slide .text, .adv .swiper-slide .cici{ width: 50%; } .adv .swiper-slide .text{ padding: 60px 40px; } .adv .swiper-slide .text .top{ padding-bottom: 45px; border-bottom: 1px solid #E4E4E4; } .adv .swiper-slide .text .ys{ width: 80px; text-align: center; font-size: 30px; font-weight: bold; color: #fff; background: #FCC326; line-height: 36px; padding: 11px 0; margin-right: 20px; } .adv .swiper-slide .text .ys2 h3{ font-size: 28px; font-weight: bold; padding-top: 20px; } .adv .swiper-slide .text .ys2 p{ font-size: 12px; } .adv .swiper-slide .text .content{ padding: 60px 0; line-height: 28px; } .adv .swiper-slide .text .tel img{ margin-top: -5px; margin-right: 10px; } .adv .swiper-slide .text .tel span{ font-size: 24px; font-weight: bold; color: #458DFE; } /*客户案例*/ .case_index .text h3{ height: 50px; line-height: 50px; text-align: center; background: #F5F5F5; padding: 0 10px; transition: all .5s ease; } .case_index .box{ position: relative; } .case_index .swiper-slide:hover h3{ background: #458DFE; color: #fff; } a.more{ display: block; width: 200px; height: 45px; text-align: center; line-height: 45px; font-size: 14px; margin:45px auto 0; border-radius: 40px; background: #EEEEEE; } a.more:hover{ background: #458DFE; border-color: #458DFE; color: #fff; } /*横幅*/ .hf{ height: 230px; background: url(../images/hf.jpg) no-repeat center; margin:50px 0; } .hf .text{ width: 510px; padding-top: 70px; text-align: right; color: #fff; text-transform: uppercase; } .hf .text p{ font-size: 12px; } .hf .text h3{ font-size: 30px; } .hf .text .tel{ margin-top: 9px; } .hf .text .t1{ width: 330px; height: 45px; line-height: 45px; font-size: 26px; font-weight: bold; padding-left: 130px; text-align: left; } .hf .text .t2 a{ display: block; width: 175px; height: 45px; } /*简介*/ .com_index .box .img, .com_index .box .text{ width: 600px; background: #fff; } .com_index .box .text{ height: auto; display: flex; align-items: center; } .com_index .box .text .global_title{ text-align: left; } .com_index .box .text .global_title h3{ font-size: 24px; line-height: 24px; } .com_index .box .text .global_title p{ font-size: 12px; text-transform: uppercase; } .com_index .box .text .global_title p.h3_en{ font-size: 72px; top: 9px; } .com_index .box .text .content{ padding: 0px 50px; background: #fff; } .com_index .box .text .t1{ line-height: 32px; margin:25px 0; color: #66686C; } .com_index .box .text a{ width: 180px; height: 45px; color: #fff; display: block; text-align: center; line-height: 45px; font-size: 15px; background: #2777F9; transition: all .5s ease; } .com_index .box .text a:hover{ background: #FDC327; } /*新闻资讯*/ .news_index{ background: #f5f5f5; } .news_index{ padding-bottom: 50px; background: #f5f5f5; margin-top: 50px; } .news_index .title h3{ font-size: 30px; padding-top: 70px; line-height: 30px; } .news_index .title p{ font-size: 16px; padding-top: 5px; padding-bottom: 30px; } .news_index .list ul li{ background: #fff; padding: 35px 40px 20px 40px; position: relative; margin-bottom: 15px; width: 590px; } .news_index .list ul li:after{ content: ''; position: absolute; width: 100px; border:2px solid #2777F9; left: 0px; bottom: 0px; transition: all .5s ease; } .news_index .list ul li h4{ font-size: 18px; font-weight: normal; line-height: 18px; } .news_index .list ul li .content{ line-height: 24px; font-size: 14px; color: #AAAAAA; margin:15px 0 30px; } .news_index .list ul li p.time{ color: #AAAAAA; font-size: 14px; } .news_index .list ul li h4 a:hover{ color: #2777F9 } .news_index .list ul li:hover:after{ width: calc(100% - 4px); } /*底部*/ .footer_index{ background: #3A3B49 !important; font-size: 15px; } .footer_index .bnav{ padding: 60px 0 40px; border-bottom: 1px solid #626371; } .footer_index .navlist{ width: 200px; } .footer_index .bnav h3{ font-size: 18px; color: #fff; font-weight: bold; margin-bottom: 20px; position: relative; } .footer_index .bnav h3:before{ content: ''; position: absolute; border:2px solid #2777F9; left:-15px; top: 4px; height: 15px; } .footer_index .navlist ul li{ width: 100px; margin-bottom: 10px; } .footer_index .navlist ul li a{ color: #f5f5f5; font-size: 15px; } .footer_index .navlist ul li a:hover{ color: #ffb700; } .footer_index .bnav .add p, .footer_index .bnav .add a, .footer_index .bnav .er p{ color: #f5f5f5; font-size: 15px; margin-bottom: 10px; } .footer_index .bnav .add ul li{ width: 100%; margin-bottom: 10px; } .footer_index .bnav .add a:hover, .footer_index .bottom a:hover{ color: #ffb700; } .footer_index .bnav .er{ margin-left: 20px; } .footer_index .bnav .er img{ width: 125px; height: 125px; margin-bottom: 10px; } .footer_index .bottom{ height: 50px; line-height: 50px; color: #f5f5f5; font-size: 15px; } .footer_index .bottom a{ color: #f5f5f5; font-size: 15px; } /*内页开始*/ .in_banner{ height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; } .in_list{ height: 70px; background: #fff; line-height: 70px; font-size: 16px; border-bottom:1px solid #E5E5E5; } .in_list ul{ width: 800px; } .in_list ul li{ height: 68px; border-bottom: 2px solid #fff; padding: 0 20px; position: relative; text-align: center; transition: all .5s ease; } .in_list ul li:last-child:after{ display: none; } .in_list ul li:hover, .in_list ul li.active{ border-bottom: 2px solid #00A69C; } .in_list .cru, .in_list .cru a{ font-size: 14px; } /*简介*/ .com_inner .com_index{ padding: 50px 0; } .com_inner .com_index h3{ font-size: 24px; color: #458DFD; } .com_inner .adv{ margin-bottom: 50px; } /*产品*/ .com_inner.pro{ padding: 50px 0; background: #f5f5f5; } .com_inner.pro .proinfo{ background: #fff; padding: 35px 40px; } .com_inner.pro .proinfo .img{ max-width: 600px; max-height: 400px; } .com_inner.pro .proinfo .text{ max-width: 520px; display: flex; align-items: center; } .com_inner.pro .proinfo .text h3{ font-size: 24px; font-weight: bold; } .com_inner.pro .proinfo .text span{ display: inline-block; width: 100%; border:1px solid #f5f5f5; margin:8px 0 10px 0; } .com_inner.pro .proinfo .text .content{ line-height: 33px; } .com_inner.pro .proinfo .text h4{ font-size: 16px; } .com_inner.pro .proinfo .text h4 span{ font-size: 24px; color: #458DFE; border:none; font-weight: bold; display: inline; } .com_inner.pro .proinfo .text .list{ height: 50px; line-height: 50px; border-bottom: 1px solid #f5f5f5; border-top:1px solid #f5f5f5; margin:20px 0; } .com_inner.pro .proinfo .text .list div{ padding-left: 15px; margin-right: 20px; } .com_inner.pro .proinfo .text .list img{ float: left; margin-right: 10px; margin-top: 11px; } .com_inner.pro .proinfo .text .sub{ width: 400px; margin-top: 30px; } .com_inner.pro .proinfo .text .sub a{ display: inline-block; width: 200px; background: #458DFE; height: 45px; line-height: 45px; text-align: center; color: #fff; font-size: 14px; } .com_inner.pro .proinfo .text .sub a.submit{ background: #ffb700; color: #fff; } .com_inner.pro .proinfo .text .sub a:hover{ font-weight: bold; } .com_inner.pro .info_content{ margin-top: 40px; } .com_inner.pro .info_content .content{ width: 860px; background: #fff; padding: 30px; } .com_inner.pro .info_content .content img{ max-width: 100%; } .com_inner.pro .info_content .other{ width: 300px; border:1px solid #F3F3F3; padding: 15px; height: 100%; background: #fff; } .com_inner.pro .info_content .content .title{ width: 100%; height: 45px;line-height: 45px; border-bottom: 1px solid #DCDCDC; } .com_inner.pro .info_content .content .title span{ font-size: 22px; color: #002A5D; } .com_inner.pro .info_content .content .box{ padding: 30px 0 0 0; } .com_inner.pro .info_content .content .box table{ width: 100% !important; } .com_inner.pro .info_content .content .box img{ margin:0 auto; } .com_inner.pro .info_content .other h4{ font-size: 20px; font-weight: bold; margin-bottom: 15px; } .com_inner.pro .info_content .other .ot{ margin-bottom: 10px; } .com_inner.pro .info_content .other .ot .cici{ max-height: 400px; } .com_inner.pro .info_content .other .ot p{ display: block; height: 40px; line-height: 40px; text-align: center; font-size: 14px; background: #F3F3F3; transition: all .5s ease; } .com_inner.pro .info_content .other .ot:hover p{ background: #ffb700; color: #fff; } .newsPage{ margin:40px 0 0 0; } .newsPage .page-a{ height: 50px; border-bottom: 1px solid #F3F3F3; line-height: 50px; } .newsPage .page-a a:hover{ color: #2777F9; } .de-page-mian { overflow: hidden; text-align: center; font-size: 0; margin: 35px auto 0; } .de-page-mian .page-inner { display: inline-block; overflow: hidden; } .de-page-mian .page-inner a { display: block; float: left; min-width: 26px; padding: 0 14px; height: 36px; border: 1px solid #dddddd; background: #fff; text-align: center; line-height: 36px; font-size: 14px; color: #333; margin-right: -1px; overflow: hidden; } .de-page-mian .page-inner a.active, .de-page-mian .page-inner a:hover { color: #fff; border-color: #2777F9; background: #2777F9; } .de-page-mian .page-inner a.prev { margin-right: 10px; background: #fff url(../images/prev.jpg) no-repeat center; } .de-page-mian .page-inner a.prev.on { background: #fff url(../images/prev-hover.jpg) no-repeat center; } .de-page-mian .page-inner a.prev:hover { background-color: #fff; border-color: #dddddd; } .de-page-mian .page-inner a.next { margin-left: 10px; margin-right: 15px; background: #fff url(../images/next.jpg) no-repeat center; } .de-page-mian .page-inner a.next.on { background: #fff url(../images/next-hover.jpg) no-repeat center; } .de-page-mian .page-inner a.next:hover { background-color: #fff; border-color: #dddddd; } .de-page-mian .page-inner a.page-btn { font-size: 12px; margin-right: 0; width: 63px; margin-left: 10px; } .de-page-mian .page-inner span { display: block; font-size: 12px; color: #333; float: left; line-height: 38px; } .de-page-mian .page-inner input { display: block; float: left; height: 36px; width: 36px; border: 1px solid #dddddd; text-align: center; line-height: 36px; font-size: 14px; color: #333; margin: 0 5px; } /*案例*/ .com_inner.style{ padding: 50px 0; } .com_inner.style .in_inner ul li{ width: 380px; height: 320px; margin: 0 19px 20px 0; } .com_inner.style .in_inner ul li:nth-child(3n){ margin-right: 0px; } .com_inner.style .in_inner ul li .cici{ width: 100%; height: 270px; background: #F1F1F1; } .com_inner.style .in_inner ul li .title{ text-align: center; height: 50px; line-height: 50px; border-bottom: 1px solid #F1F1F1; font-size: 15px; padding: 0 15px; } .com_inner.style .in_inner ul li:hover .title{ background: #448CFD; } .com_inner.style .in_inner ul li:hover a{ color: #fff; } /*资料下载*/ .pol_list ul li{ margin-bottom: 15px; font-size: 16px; border-bottom: 1px solid #DCDCDC; padding-bottom: 25px; } .pol_list ul li p{ width: 600px; float: left; font-size: 18px; } .pol_list ul li b{ display: inline-block; border:3px solid #458CFD; float: left; margin-top: 11px; margin-right: 10px; } .pol_list ul li span{ float: right; } .pol_list ul li:hover a{ color: #458CFD; font-weight: bold; } .pol_list ul li:hover{ border-bottom: 1px solid #458CFD; } .pol_list ul li .text{ line-height: 28px; padding-left: 16px; margin-top: 10px; color: #6C6C6C; } .serright.sb .pol_list ul li p{ width: 85%; font-size: 16px; } .serright.sb .pol_list ul li{ padding-bottom: 15px; padding-left: 40px; } .serright.sb .pol_list ul li span{ font-size: 14px; } .serright.sb .pol_list ul li b{ margin-top: 8px; } .serright.sb .pol_list ul li .text{ font-size: 14px; } .serright .title h3{ font-size: 24px; font-weight: bold; border-bottom: 1px solid #DCDCDC; padding:10px 0 15px; margin-bottom: 40px; } .serright .pane .qa{ margin-top: 25px; padding-bottom: 15px; border-bottom: 1px solid #DCDCDC; } .serright .pane .qa h3{ font-size: 18px; position: relative; padding-left: 45px; font-weight: bold; } .serright .pane .qa h3{ color: #000; display: inline-block; } .serright .pane .qa h3:hover a{ color: #009F34; } .serright .pane .qa .content{ font-size: 15px; color: #6C6C6C; line-height: 28px; margin-top: 10px; position: relative; padding-left: 45px; } /*详情页*/ .news_detail_box{ padding: 0px 0; } .news_detail_box .news_detail_title{ padding: 10px 0; border-bottom: 1px solid #DDDDDD; } .news_detail_box .news_detail_title .h3{ font-size: 26px; text-align: center; color: #002361; font-weight: bold; } .news_detail_box .news_detail_title .b{ margin:.6% 0; } .news_detail_box .news_detail{ padding: 2%; } .news_detail_box .news_detail img{ display: inline-block; } .news_detail_box .news_detail_title .b a{ color: #555555; font-size: 18px; margin-right: 10px; } .news_detail_box .news_detail_title .b a.f-add{ font-size: 22px; } .news_detail_box .news_detail_title .b a.f-dec{ font-size: 14px; margin-right: 0px; } .news_detail_box .news_detail_title .b a:hover{ color: #122C68; } /*留言*/ .com_inner.contact{ background: #f5f5f5; padding-top: 50px; padding-bottom: 50px; } #dituContent img{ max-width: none; } .com_inner.contact .de-contact{ background: #fff; } .com_inner.contact .de-contact .contact-list{ width: 600px; padding: 44px; } .com_inner.contact .de-contact .contact-list h3{ font-size: 24px; color: #448CFD; font-weight: bold; margin-bottom: 4px; } .com_inner.contact .de-contact .contact-list h4{ font-size: 18px; font-weight: bold; margin-bottom: 15px; } .com_inner.contact .de-contact .contact-list p{ line-height: 36px; font-size: 16px; } .com_inner.contact .de-contact .contact-list .p{ padding-left: 110px } .com_inner.contact .de-contact .contact-list p:hover a{ color: #2777F9; } .com_inner.contact .de-contact .contact-list .wxx{ margin-top: 30px; } .com_inner.contact .de-contact .contact-list .wxx .wx1{ margin-right: 20px; } .com_inner.contact .de-contact .contact-list .wxx .wx1 img{ width: 120px; height: 120px; } .com_inner.contact .de-contact .contact-map{ width: 600px; } .com_inner.contact .de-contact .contact-map #dituContent{ width: 100%; height: 475px; } .contact-liuyan{ background: #fff; padding: 0 50px 50px; margin-top: 50px; } .com_inner.contact .in_title{ padding-bottom: 30px; } .com_inner.contact .in_title h3{ font-size: 24px; font-weight: bold; padding-top: 50px; } .contact-liuyan .form-right{ display: flex; flex-direction: row; flex-wrap: wrap; width: 50%; } .contact-liuyan .inputbox{ display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; position: relative; } .contact-liuyan input[type=text]{ width: 48.5%; line-height: 45px; border:1px solid #eee; padding-left: 15px; outline: none; background: #F1F1F1; font-size:14px; color:#333; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; margin-bottom: 8px; } .message.ser .contact-liuyan input[type=text]{ width: 33%; } .contact-liuyan input:focus{ border:1px solid #da0000; } .contact-liuyan input[type=text]::placeholder{ font-size:14px; color:#999; } .contact-liuyan input[name=captcha]{ width: 40%; margin-right: 15px; } .contact-liuyan .verify{ height: 45px; width: 20%; } .contact-liuyan .verify img{ height: 100%; } .contact-liuyan textarea{ width:100%; height: 155px; border:1px solid #eee; background: #F1F1F1; padding:15px; outline: none; resize: none; font-size:14px; color:#333; margin-bottom: 8px; font-family: "Microsoft Yahei"; } .contact-liuyan textarea::placeholder{ font-size:14px; color:#999; } .contact-liuyan textarea:focus{ border:1px solid #da0000; } .contact-liuyan .pink-btn{ padding: 16px 145px; background: #448CFD; border:none; color: #fff; cursor: pointer; } .contact-liuyan .pink-btn:hover{ background: #ffb700 } .footer_index select { width: 220px; padding-left: 12px; height: 40px; margin:15px 0 20px; line-height: 40px; font-size: 14px; background: #2678F8; appearance: none; -webkit-appearance: none; -ms-appearance: none; -moz-appearance: none; -o-appearance: none; background: #2678F8 url(../images/ar.jpg) right no-repeat; overflow: hidden; color: #fff; margin-top: 30px; } .footer_index select option{ height: 40px; line-height: 40px; }