@charset "utf-8"; @media screen and (min-width:769px){ #header .logo{ float: left; margin: 30px 0; } #header .logo a img{ height: 40px; } #header .menu{ position:absolute; top:50%; left:212px; right:170px; margin-top:-25px; font-size: 0; letter-spacing: -1px; } #header .menu > a{ display: inline-block; vertical-align: top; letter-spacing: 0; line-height: 50px; font-size: 16px; color: #333; margin-left:8%; } #header .menu > a:hover{ color: #1b68a5; } #header .menu > a:hover{ color: #1b68a5; border-bottom: 2px solid #1b68a5; } #header .menu > a.bb{ display: none; } #header .fl-right{ font-size: 0; letter-spacing: -1px; position:absolute; right:0; top:50%; margin-top:-14px; } #header .fl-right *{ display: inline-block; vertical-align: top; letter-spacing: 0; font-size: 14px; line-height: 28px; color: #a4a4a6; } #header .fl-right span{ margin: 0 5px; } #header .fl-right font{ margin: 0 34px; } #header .fl-right a:hover{ color: #01599e; } #header .fl-right form{ width: 28px; height: 28px; position: relative; background: url(../images/s.png) center no-repeat; } #header .fl-right form input{ position: absolute; top: 0; display: none; height: 28px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #header .fl-right form input[type='text']{ right: 27px; width: 180px; padding: 0 5px; } #header .fl-right form input[type='submit']{ width: 28px; right: 0; background: none; overflow: hidden; text-indent: -99999px; border: 1px solid #cdcdcd; } #header .fl-right form:hover input{ display: block; } .aboutBox .w{ width: 1920px; position: absolute; left: 50%; top: 0; margin-left: -960px; } .aboutBox .pic{ float: right; width: 960px; } .aboutBox .pic img{ width: 960px; height: 537px; } .serviceBox .input{ float: left; width: 47%; margin: 12px 0 0 2%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .serviceBox .textarea{ width: 96%; } } @media screen and (max-width:1704px){ #among{ margin-left: 12px; margin-right: 12px; } } @media screen and (min-width:769px) and (max-width:1366px){ .wrapper{ padding-top:81px; } #header .logo{ margin: 20px 0; } #header .menu > a{ font-size: 15px; } .proBox .tn span{ font-size: 30px; } .proBox .tn font{ font-size: 40px; } .proBox1 .box ul a span{ font-size: 16px; } .proBox1 .box ul a font{ font-size: 13px; } .caseBox > span{ font-size: 30px; } .caseBox .width li span{ font-size: 24px; } .caseBox .width li font{ font-size: 16px; } .aboutBox .info > span, .aboutBox .info > font{ font-size: 22px; } .aboutBox .info > b{ font-size: 16px; } .newsBox .list a ul span{ font-size: 16px; } .bottom ul > span{ font-size: 26px; } .bottom li a span{ font-size: 18px; } .bottom li a font, #footer .wechat span{ font-size: 14px; } .company .list > li > span{ font-size: 20px; } .company .list > li > div{ font-size: 15px; } .company .list > i{ height: 220px; } .company .info{ margin-top: 0; } .company .info > span, .company .info > font{ font-size: 22px; } .company .info > div, .company .info > div *{ line-height: 26px; } .type_name{ font-size: 22px; } .list_share a span{ font-size: 14px; } .list_news a li span{ font-size: 16px; } .list_case a font{ font-size: 16px; } .list_catalog > span{ font-size: 22px; } .location2{ font-size: 22px; } .location3 li{ font-size: 26px; } .location4 li{ font-size: 30px; } .location4 span{ font-size: 18px; } .case_details .tn{ font-size: 22px; } .list_service a li span{ font-size: 20px; } } @media screen and (max-width:768px){ .wrapper{ min-width: 320px; padding-top: 50px; } .header{ position: fixed; top: 0; left: 0; right: 0; z-index: 999; border-bottom: 0; box-shadow:0 0 5px 2px rgba(0,0,0,.2); } #header .logo{ display: inline-block; vertical-align: top; margin: 8px 0; } #header .logo img{ height: 34px; } #header .fl-right{ display: none; } #header .menu{ position: fixed; z-index: 998; top: 50px; left: -100%; width: 100%; bottom: 0; padding-bottom: 3%; overflow-y: auto; background: #FFF; transition: all .3s; border-top: 1px solid #cdcdcd; } .on #header .menu{ left: 0; } #header .menu a{ display: block; font-size: 16px; color: #040404; margin: 3% 0 0; padding: 1% 6%; } .header > em{ display:block; position:fixed; top:0; right:0; width:50px; height:50px; z-index:998; cursor:pointer; } .header > em:after{ content:''; display:block; height:15px; width:15px; background: #1b68a5; border-radius:4px; box-shadow:17px 0 0 #7d7d7d, 0 17px 0 #7d7d7d, 17px 17px 0 #1b68a5; margin:9px 0 0 9px; } .header > em:before, .on .header > em:after{ content:''; height:3px; width:24px; background: #cecece; border-radius:2px; position:absolute; top:50%; left:50%; margin:-35px 0 0 -22px; transform:rotate(45deg); } .on .header > em:before, .on .header > em:after{ margin:-1px 0 0 -12px; transform:rotate(-45deg); box-shadow:0 0 0 #00469b, 0 0 0 #00469b, 0 0 0 #999; } .on .header > em:after{ transform:rotate(45deg); } .bottom,.footer,.footer1{ display: none; } .index .bottom,.index .footer{ display: block; } .bottom ul > span{ font-size: 17px; } .bottom li a{ background-size:30px; padding-left: 36px; } .bottom li a:nth-child(2){ margin: 0 calc((96% - 300px) / 2); } .bottom li a span{ font-size: 14px; line-height: 16px; } .bottom li a font{ font-size: 12px; line-height: 12px; margin-top: 4px; } .footer{ padding: 15px 12px; background-position: 0 64px; } #footer *{ line-height: 1.8; } #footer .info{ float: none; width: auto; } #footer .info > span{ margin-top: 24px; } #footer .type{ float: none; width: auto; margin-top: 15px; } #footer .type > a{ display: block; margin: 0 -12px; padding: 0 12px; border-bottom:1px solid #e0e0e0; } #footer .type ul{ margin-top: 10px; } #footer .type ul li{ margin: 6px 0 0; } #footer .type ul li a{ display: block; padding: 0 0 0 18px; } #footer .type ul li a:before{ content: '>> '; font-family: '宋体'; } #footer .wechat > img{ margin-top: 10px; } #footer .wechat span{ font-size: 14px; } #footer .copyright{ text-align: center; margin: 8px 0; } #footer .copyright, #footer .copyright *{ line-height: 1.8; } .banner .arrow{ height: 12px; } .banner .arrow span{ width: 16px; height: 2px; margin: 0 3px; } .proBox .tn span{ font-size: 18px; } .proBox .tn font{ font-size: 24px; } .caseBox > span{ font-size: 20px; } .aboutBox .width{ height: auto; } .aboutBox .info{ width: auto; padding-top: 0; } .aboutBox .info > div{ height: auto; } .aboutBox .info > span, .aboutBox .info > font{ font-size: 18px; } .aboutBox .info > b{ font-size: 16px; margin-top: 10px; } .aboutBox .info > div{ margin-top: 8px; } .aboutBox .info > a{ margin-top: 4%; } .aboutBox .pic{ margin-top: 4%; } .aboutBox .pic img{ width: 100%; } .aboutBox .pic .arrow{ margin-top: 10px; } .newsBox .list a{ float: none; width: auto; height: 86px; margin: 12px 0 0; } .newsBox .list a img{ width: 124px; } .newsBox .list a ul{ margin: 0 0 0 134px; } .newsBox .list a ul span{ font-size: 15px; line-height: 24px; padding-bottom: 5px; } .newsBox .list a ul li{ line-height: 22px; height: 44px; -webkit-line-clamp:2; margin: 10px 0 0; color:#b1b1b1; } .newsBox .more{ margin-top: 4%; } .newsBox .more a{ width: 110px; line-height: 32px; font-size: 12px; } .list_news a{ height: 86px; margin: 12px 0 0; } .list_news a img{ width: 124px; } .list_news a li{ margin: 0 0 0 134px; } .list_news a li span{ font-size: 15px; margin: 5px 0 0; line-height: 32px; } .list_news a li p{ line-height: 20px; height: 40px; font-size: 13px; margin: 0; } .list_news a li font, .list_news a li:after{ display: none; } .caseBox .width{ height: 100%; left: 0; right: 0; position: absolute; background: rgba(255,255,255,.4); } .caseBox .width li{ width: 100%; height: auto; bottom: auto; background: none; top: 50%; margin-top: -49px; } .caseBox .width li span{ margin: 0; font-size: 18px; line-height: 36px; text-align: center; color: #000; } .caseBox .width li font{ margin: 0; font-size: 14px; line-height: 24px; text-align: center; color: #000; } .caseBox .width li a{ width: auto; text-align: center; line-height: 24px; margin: 12px auto 0; position: static; font-size: 12px; border: 0; color: #000; text-decoration: underline; } .proBox1{ padding: 12px 0; } .proBox1 .box{ padding: 0; } .proBox1 .box .btn{ display: none; } .proBox1 .box .arrow{ display: block; text-align: center; } .proBox1 .box .arrow > *{ margin: 0 3px; } .proBox1 .box ul{ width: calc(50% - 18px); margin: 12px 0 0 12px; } .proBox1 .box ul:nth-child(-n+2){ margin-top: 0; } .proBox1 .box ul a{ margin: 0; padding: 8px 10px; } .proBox1 .box ul a span{ font-size: 16px; } .location4 li{ font-size: 18px; } .location4 span{ font-size: 14px; } .type_name, .case_details .tn{ font-size: 18px; } .case_details .fl-left{ margin-top: 12px; } .case_details .fl-left, .case_details .fl-right{ float: none; width: auto; } .case_details .fl-right, .case_details .fl-right *{ font-size: 14px!important; } .case_details .fl-left, .case_details .fl-left *{ font-size: 14px!important; } .list_case a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .list_case a:nth-child(-n+2){ margin-top: 0!important; } .list_case a:nth-child(2n+1){ margin-left: 0!important; } .list_case a span{ margin: 5px 10px 0; } .list_case a font{ font-size: 16px; margin: 0 10px; } .list_case a:after{ content: '查看更多 >'; margin: 12px 10px 6px; } .list_type a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .list_type a:nth-child(-n+2){ margin-top: 0!important; } .list_type a:nth-child(2n+1){ margin-left: 0!important; } .list_pro a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .list_pro a:nth-child(-n+2){ margin-top: 0!important; } .list_pro a:nth-child(2n+1){ margin-left: 0!important; } .list_share a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .list_share a:nth-child(-n+2){ margin-top: 0!important; } .list_share a:nth-child(2n+1){ margin-left: 0!important; } .list_share a span{ font-size: 14px; margin-top: 0; } #location{ display: none; } .navBox ul li{ padding: 0 3%; } .navBox ul li a{ font-size: 15px; line-height: 40px; position: relative; } .navBox ul li.on a:after{ height: 1px; left: -5px; right: -5px; } .my-map{ height: 300px; margin-left: 0; margin-right: 0; } .contactBox .cont{ margin: 0 0 4%; line-height: 1.8; } .messageBox .text{ margin: 0; } .messageBox .input, .messageBox .button{ margin-left: 0; margin-right: 0; } .list_history > i{ left: 3px; } .list_history:before, .list_history:after{ left: 0; margin-left: -2px; } .list_history > div{ width: auto; margin: 5% 0 0!important; padding: 0 0 0 22px!important; } .list_history > div:before{ left: 0!important; margin-left: -2px!important; } .list_history > div > li, .list_history > div > span{ text-align: left !important; } .list_history > div > span{ font-size: 20px; } .list_history > div > ul{ position: static; padding: 0; text-align: left !important; } .list_history > div > ul > li{ width: 48.7%; margin-left: 2.4%; } .list_history > div > ul > li:nth-child(1){ margin-left: 0; } .list_history > div > li{ min-height: 12px; } .list_history > div > li, .list_history > div > li *{ line-height: 2; } .company .list > li{ width: auto; display: block; padding-bottom: 3%; margin-top: 3%; } .company .list > li:nth-child(1){ margin-top: 0; } .company .list > li > span{ font-size: 18px; } .company .list > li > span:after{ content: ''; display: block; width: 40px; height: 1px; margin-top: 8px; background: #676767; } .company .list > li > div{ font-size: 15px; margin-top: 3%; } .company .list > i{ display: none; } .company .info{ float: none; width: auto; } .company .info > span, .company .info > font{ font-size: 18px; } .company .info > div, .company .info > div *{ line-height: 1.8; } .company .img{ float: none; width: auto; margin-top: 3%; } .company .list1 a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .company .list1 a:nth-child(-n+2){ margin-top: 0!important; } .company .list1 a:nth-child(2n+1){ margin-left: 0!important; } .list_service a{ float: none; width: auto; margin: 12px 0 0 0!important; } .list_service a li span{ font-size: 15px; } .location5{ font-size: 18px; } .list_catalog > span{ font-size: 18px; } .list_catalog a span{ margin-top: 0; } .sidebar a{ font-size: 15px; } .searchBox li > span{ display: block; } .searchBox li > *{ width: calc(33.33333% - 8px); margin: 12px 0 0 12px!important; } .searchBox li > *:nth-child(-n+4){ margin-top: 0!important; } .searchBox li > span:nth-child(1), .searchBox li > select:nth-child(2), .searchBox li > select:nth-child(5), .searchBox li > select:nth-child(8){ margin-left: 0!important; } .location2{ font-size:18px; } .location3 li{ font-size:20px; } .details .fl-left, .details .fl-right{ width: auto; float:none; } .floatBox{ display: none; } } @media screen and (min-width:481px) and (max-width:768px){ .list_catalog a{ width: calc(33.33333% - 8px); min-width: 12px; margin: 12px 0 0 12px!important; } .list_catalog a:nth-child(3n+1){ margin-left: 0!important; } .details .list1 a{ width: calc(33.33333% - 8px); margin: 12px 0 0 12px!important; } .details .list1 a:nth-child(-n+3){ margin-top: 0!important; } .details .list1 a:nth-child(3n+1){ margin-left: 0!important; } .details .list2 a{ width: 23.5%; margin: 2% 0 0 2%!important; } .details .list2 a:nth-child(4n+1){ margin-left: 0!important; } } @media screen and (max-width:480px){ .bottom li a:nth-child(2){ margin: 0 calc((100% - 282px) / 2); } .list_catalog a{ width: calc(50% - 6px); min-width: 12px; margin: 12px 0 0 12px!important; } .list_catalog a:nth-child(2n+1){ margin-left: 0!important; } .details .list1 a{ width: calc(50% - 6px); margin: 12px 0 0 12px!important; } .details .list1 a:nth-child(-n+2){ margin-top: 0!important; } .details .list1 a:nth-child(2n+1){ margin-left: 0!important; } .details .list2 a{ width: calc(33.33333% - 8px); margin: 12px 0 0 12px!important; } .details .list2 a:nth-child(3n+1){ margin-left: 0!important; } }