| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117 |
- @charset "utf-8";
- body {
- margin: 0;
- padding: 0;
- overflow-x: hidden;
- background: #F4F5FA;
- }
- * {
- margin: 0;
- padding: 0;
- font-size: 14px;
- font-family: '微软雅黑', 'Microsoft YaHei', Verdana, Arial, Helvetica, sans-serif;
- color: #666;
- font-style: normal;
- list-style: none;
- text-decoration: none;
- box-sizing: border-box;
- }
- article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
- display: block;
- }
- img {
- display: block;
- max-width: 100%;
- max-height: 100%;
- border: none;
- }
- input, button, select {
- border: 0;
- outline: none;
- }
- a:hover {
- color: #ee0f15 !important;
- }
- input::-webkit-input-placeholder {
- color: #aaa;
- }
- [placeholder]:focus::-webkit-input-placeholder {
- -webkit-transition: opacity 0.5s ease;
- -moz-transition: opacity 0.5s ease;
- -o-transition: opacity 0.5s ease;
- transition: opacity 0.5s ease;
- opacity: 0
- }
- [placeholder]:focus::-moz-input-placeholder {
- -webkit-transition: opacity 0.5s ease;
- -moz-transition: opacity 0.5s ease;
- -o-transition: opacity 0.5s ease;
- transition: opacity 0.5s ease;
- opacity: 0
- }
- a, a img, input {
- -webkit-transition: all 0.18s ease-out;
- -o-transition: all 0.18s ease-out;
- -moz-transition: all 0.18s ease-out;
- transition: all 0.18s ease-out;
- }
- .clearfix:after {
- content: "";
- display: block;
- height: 0;
- visibility: hidden;
- clear: both;
- }
- .clearfix {
- zoom: 1;
- }
- .nowrap {
- overflow: hidden;
- -o-text-overflow: ellipsis;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- .fl {
- float: left;
- }
- .fr {
- float: right;
- }
- .container {
- position: relative;
- width: 1200px;
- margin: 0 auto;
- }
- .mt20 {
- margin-top: 20px;
- }
- .mt10 {
- margin-top: 10px;
- }
- .mt30 {
- margin-top: 30px;
- }
- .ml20 {
- margin-left: 20px;
- }
- .mb30 {
- margin-bottom: 30px;
- }
- .pc_show {
- display: none;
- }
- /* top */
- header {
- background: #fff;
- }
- .t-header {
- height: 36px;
- line-height: 36px;
- background: #e3e4e5;
- }
- .t-header p {
- font-size: 12px;
- color: #999;
- }
- .t-header p i {
- vertical-align: top;
- margin-right: 3px;
- font-size: 18px;
- color: #777;
- line-height: 36px;
- }
- .t-header p a:hover i {
- color: #ee0f15;
- }
- .t-header p a {
- padding: 0 10px;
- font-size: 12px;
- }
- .t-header li {
- position: relative;
- float: left;
- padding: 0 12px;
- font-size: 12px;
- cursor: pointer;
- }
- .t-header li:hover {
- color: #ee0f15;
- }
- .t-header li a {
- font-size: 12px;
- }
- .t-header li b {
- color: #ee0f15;
- }
- .t-header li i {
- vertical-align: middle;
- margin-top: -4px;
- margin-right: 8px;
- font-size: 20px;
- }
- .t-header li i.fa-weixin {
- font-size: 16px;
- }
- .t-header li:hover i {
- color: #ee0f15;
- }
- .t-header li.wx div {
- z-index: 99;
- position: absolute;
- top: 36px;
- left: 50%;
- display: none;
- width: 120px;
- height: 120px;
- margin-left: -60px;
- box-shadow: 0 0 6px rgba(0, 0, 0, .3)
- }
- .t-header li.wx:hover div {
- display: block;
- }
- .t-header li.web-nav i {
- margin-right: 4px;
- font-size: 16px;
- }
- .t-header li.web-nav div {
- z-index: 999;
- position: absolute;
- top: 36px;
- right: 0;
- width: 300px;
- display: none;
- padding: 15px 20px;
- padding-bottom: 0;
- background: #Fff;
- border: 1px solid #e5e5e5;
- }
- .t-header li.web-nav dl {
- display: block;
- padding-bottom: 15px;
- margin-bottom: 15px;
- line-height: 24px;
- overflow: hidden;
- border-bottom: 1px solid #e5e5e5;
- }
- .t-header li.web-nav dl:last-child {
- border-bottom: 0;
- }
- .t-header li.web-nav dt {
- display: block;
- font-size: 12px;
- color: #8a9b42;
- }
- .t-header li.web-nav dl:nth-of-type(2) dt {
- color: #ee0f15;
- }
- .t-header li.web-nav dl:nth-of-type(3) dt {
- color: #ff9326;
- }
- .t-header li.web-nav dd {
- display: block;
- width: 270px;
- }
- .t-header li.web-nav dd a {
- display: inline-block;
- margin-right: 15px;
- }
- .t-header li.web-nav:hover div {
- display: block;
- }
- .m-header {
- padding: 20px 0;
- }
- .m-header .logo {
- max-width: 240px;
- }
- .m-header .logo a {
- display: block;
- }
- .m-header .logo p {
- margin-top: 5px;
- font-size: 12px;
- color: #ee0f15;
- text-align: center;
- letter-spacing: 2px;
- }
- .search-con {
- position: relative;
- width: 520px;
- margin-right: 40px;
- margin-top: 8px;
- font-size: 0;
- }
- .search-con form {
- position: relative;
- display: block;
- width: 100%;
- height: 40px;
- margin-bottom: 8px;
- padding-left: 40px;
- padding-right: 100px;
- line-height: 40px;
- overflow: hidden;
- border: 1px solid #ee0f15;
- }
- .search-con .fa-search {
- position: absolute;
- left: 0;
- top: 0;
- width: 40px;
- height: 40px;
- font-size: 22px;
- color: #bbb;
- line-height: 36px;
- text-align: center;
- -webkit-text-stroke: 1px #fff;
- }
- .search-con .s-input {
- width: 100%;
- height: 100%;
- border: 0;
- color: #666;
- }
- .search-con .s-button {
- position: absolute;
- top: 0;
- right: 0;
- width: 100px;
- height: 38px;
- font-size: 18px;
- color: #fff;
- background: #ee0f15;
- border: 0;
- cursor: pointer;
- }
- .search-con p {
- max-width: 100%;
- margin-top: 6px;
- font-size: 12px;
- color: #ee0f15;
- overflow: hidden;
- }
- .search-con p b {
- font-size: 12px;
- }
- .search-con p a {
- display: inline-block;
- font-size: 12px;
- color: #777;
- margin-right: 10px;
- }
- .m-header-sider {
- margin-top: 8px;
- overflow: hidden;
- }
- .m-header-sider p {
- margin-left: 10px;
- }
- .m-header-sider p a {
- display: block;
- width: 110px;
- height: 38px;
- background: #F4E9C7;
- text-align: center;
- line-height: 38px;
- color: #856F31;
- }
- .m-header-sider p a:last-child {
- margin-top: 8px;
- }
- .m-header-sider p a:hover {
- background: #A0875A;
- color: #fff!important;
- }
- .m-header-sider p i {
- margin-right: 6px;
- font-size: 16px;
- color: #856F31;
- }
- .m-header-sider p a:hover i {
- color: #fff;
- }
- /*导航*/
- .navigation {
- width: 100%;
- height: 40px;
- line-height: 40px;
- background: #3A3A41;
- }
- .fl-nav {
- position: relative;
- width: 240px;
- height: 40px;
- margin-right: 25px;
- background: #4B4B5B;
- text-align: center;
- cursor: pointer;
- }
- .fl-nav span {
- display: block;
- font-size: 16px;
- color: #fff;
- }
- .fl-nav i {
- vertical-align: middle;
- margin-right: 10px;
- margin-top: -3px;
- font-size: 20px;
- color: #fff;
- -webkit-text-stroke: 1px #4B4B5B;
- }
- .nav-list li {
- float: left;
- margin-right: 20px;
- position: relative;
- }
- .nav-list li:nth-of-type(2)::after {
- position: absolute;
- content: url(../images/icon_hot.png);
- top: -4px;
- right: -10px;
- }
- .nav-list li:hover::before, .nav-list li.active::before {
- position: absolute;
- content: '';
- left: 50%;
- bottom: 2px;
- width: 20px;
- height: 4px;
- margin-left: -10px;
- background: #bfaa6e;
- border-radius: 4px;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- -ms-border-radius: 4px;
- -o-border-radius: 4px;
- }
- .nav-list li.active, .nav-list li:hover {
- background: #23232A;
- }
- .nav-list li a {
- display: block;
- padding: 0 22px;
- font-size: 16px;
- color: #fff!important;
- }
- /* link */
- .linkCon {
- padding: 30px;
- background: #fff;
- }
- .linkCon h2 {
- position: relative;
- height: 35px;
- font-size: 18px;
- font-weight: normal;
- color: #333;
- line-height: 24px;
- border-bottom: 1px solid #dfdfdf;
- }
- .linkCon h2::before {
- position: absolute;
- content: '';
- left: 0;
- bottom: -1px;
- width: 72px;
- border-bottom: 1px solid #333;
- }
- .linkCon ul {
- width: 1200px;
- }
- .linkCon ul li {
- display: inline-block;
- vertical-align: top;
- margin-top: 15px;
- margin-right: 20px;
- }
- /*底部*/
- .online-box {
- padding: 24px 0;
- background: #00704A;
- }
- footer {
- padding-top: 30px;
- background: url(../images/fd_bg.png) center bottom no-repeat;
- background-size: cover;
- }
- .foot-nav {
- line-height: 50px;
- text-align: center;
- }
- .foot-nav li {
- position: relative;
- display: inline-block;
- vertical-align: top;
- margin: 0 15px;
- }
- .foot-nav li a {
- color: #fff;
- }
- .ftlx-box {
- margin-top: 30px;
- }
- .ftlx-box .fl strong {
- font-size: 18px;
- color: #eee;
- font-weight: normal;
- }
- .ftlx-box .fl span {
- display: block;
- margin-top: 15px;
- color: #eee;
- }
- .ftlx-box .fr span {
- display: inline-block;
- vertical-align: top;
- width: 100px;
- margin-left: 15px;
- text-align: center;
- color: #ccc;
- }
- .ftlx-box .fr span img {
- margin-bottom: 5px;
- }
- footer p {
- margin-top: 40px;
- padding: 15px 0;
- font-size: 12px;
- color: #bbb;
- text-align: center;
- line-height: 24px;
- border-top: 1px solid #666;
- }
- footer p a {
- font-size: 12px;
- color: #ccc;
- }
- /* 侧边栏 */
- .siderBar {
- position: fixed;
- top: 250px;
- right: 0;
- -width: 36px;
- z-index: 99;
- }
- .siderBar>div {
- width: 36px;
- padding: 14px 5px;
- text-align: center;
- cursor: pointer;
- line-height: 17px;
- }
- .free-tel {
- background: #fffbef;
- color: #856f31;
- border: 1px solid #bca35b;
- }
- .free-tel:hover {
- background: #f4e9c7;
- }
- .siderBar i {
- margin-bottom: 4px;
- font-size: 20px;
- color: #856f31;
- }
- .online {
- background: #bca35b;
- }
- .online:hover {
- background: #a0875a
- }
- .online a {
- display: block;
- color: #fff!important;
- }
- .online i {
- color: #fff;
- }
- .side-wx {
- position: relative;
- margin-top: 2px;
- background: #fff;
- border: 1px solid #ccc;
- }
- .side-wx:hover {
- background: #999;
- color: #fff;
- }
- .side-wx span {
- position: absolute;
- right: 50px;
- top: 0;
- display: none;
- width: 85px;
- box-shadow: 0 0 5px rgba(0, 0, 0, .2);
- }
- .side-wx span::after {
- position: absolute;
- content: '';
- top: 50%;
- right: -16px;
- margin-top: -8px;
- border: 8px solid transparent;
- border-left-color: #fff;
- }
- .side-wx i {
- color: #bcbcbc;
- }
- .side-wx:hover i {
- color: #fff;
- }
- .side-wx:hover span {
- display: block;
- }
- .input-select {
- border: 1px solid #e5e5e5;
- width: 140px;
- height: 40px;
- line-height: 40px;
- }
- .complaint {
- margin-top: 2px;
- background: #999;
- border: 1px solid #ccc;
- }
- .complaint a, .complaint i {
- color: #fff;
- }
- .complaint i {
- color: #fff;
- }
- .complaint:hover {
- background: #fff;
- }
- .complaint:hover a {
- color: #666!important;
- }
- .complaint:hover i {
- color: #bcbcbc;
- }
- .siderBar .go-top {
- display: none;
- padding: 6px 2px;
- margin-top: 2px;
- background: #fff;
- border: 1px solid #ccc;
- }
- .siderBar .go-top:hover {
- border: 1px solid #a0875a;
- color: #a0875a;
- }
- .go-top i {
- margin-bottom: 0;
- color: #999;
- }
- /* */
- .spot-bg {
- z-index: 666;
- position: fixed;
- top: 0;
- left: 0;
- display: none;
- width: 100%;
- height: 100%;
- background: rgba(0, 0, 0, .5);
- }
- .fixed-foot {
- z-index: 667;
- position: fixed;
- left: 0;
- bottom: -170px;
- width: 100%;
- height: 120px;
- background: #222;
- transition: all 0.3s ease;
- -webkit-transition: all 0.3s ease;
- -moz-transition: all 0.3s ease;
- -ms-transition: all 0.3s ease;
- -o-transition: all 0.3s ease;
- }
- .fixed-foot img {
- position: relative;
- top: -56px;
- float: left;
- width: 173px;
- }
- .fixed-foot p {
- width: 260px;
- padding-top: 30px;
- margin-left: 5px;
- }
- .fixed-foot p strong {
- display: block;
- font-size: 26px;
- color: #fff;
- line-height: 35px;
- }
- .fixed-foot p span {
- display: block;
- font-size: 12px;
- color: #70777A;
- margin-top: 6px;
- }
- .fixed-foot form {
- float: right;
- padding-top: 30px;
- margin-right: 40px;
- position: absolute;
- top: 12px;
- right: -20px;
- /*float: right;
- padding-top: 30px;
- margin-right: 40px;*/
- }
- .fixed-foot input {
- height: 44px;
- margin-right: 10px;
- padding-left: 32px;
- background: #fff;
- background-repeat: no-repeat;
- background-position: 10px center;
- background-size: 16px;
- border-radius: 2px;
- -webkit-border-radius: 2px;
- -moz-border-radius: 2px;
- -ms-border-radius: 2px;
- -o-border-radius: 2px;
- }
- .fixed-foot .name {
- width: 160px;
- background-image: url(../images/icon_user.png);
- }
- .fixed-foot .xm {
- width: 160px;
- background-image: url(../images/icon_project.png);
- }
- .fixed-foot .phone {
- width: 240px;
- background-image: url(../images/icon_tel.png);
- }
- .fixed-foot .submit {
- width: 140px;
- padding-left: 0;
- background: #ee0f15;
- font-size: 18px;
- color: #fff;
- cursor: pointer;
- }
- .fixed-foot-on {
- bottom: 0;
- }
- .fixed-foot i {
- position: absolute;
- right: 0;
- top: 38px;
- font-size: 30px;
- color: #ddd;
- cursor: pointer;
- -webkit-text-stroke: 5px #222;
- }
- .hb-title {
- padding-top: 30px;
- padding-bottom: 20px;
- font-size: 22px;
- color: #333;
- }
- .hb-title i {
- vertical-align: middle;
- margin-top: -4px;
- margin-right: 8px;
- font-size: 28px;
- }
- .hb-title>a {
- float: right;
- margin-top: 6px;
- color: #999;
- font-weight: normal;
- }
- @media screen and (max-width:768px) {
- .mob_none {
- display: none!important;
- }
- .pc_show {
- display: block;
- }
- .container {
- width: 100%;
- padding: 0;
- }
- .m-header {
- padding: 0 15px;
- height: 50px;
- border-bottom: 1px solid #e4e7e8;
- }
- .m-header .logo {
- height: 30px;
- margin-top: 10px;
- }
- .m-header .logo a {
- height: 100%;
- }
- .m-header .logo img {
- width: auto;
- height: 100%;
- }
- .m-header i {
- position: absolute;
- right: 15px;
- top: 10px;
- height: 30px;
- line-height: 30px;
- font-size: 30px;
- color: #777;
- -webkit-text-stroke: 1px #fff;
- }
- .w-header {
- width: 100%;
- height: 3.429rem;
- background: #fff;
- display: flex;
- border-bottom: 1px solid #D1D4E7;
- position: fixed;
- top: 0;
- left: 0;
- z-index: 100;
- }
- .w-header-left {
- width: 3.435rem;
- height: 3.429rem;
- float: left;
- }
- .w-header-left a{
- width: 3.435rem;
- height:3.429rem;
- display:block;
- background:url(../images/fanhui.png) no-repeat center center;
- background-size: 2rem;
- }
- .w-header-logo{
- flex:1;
- text-align:center;
- line-height: 3.429rem;
- font-size: 1.485rem;
- color: #ee0f15;
- font-weight:bold;
- overflow:hidden;
- white-space:nowrap;
- text-overflow:ellipsis;
- }
- .w-header-logo img{
- width:4.33rem;
- height:0.4rem;
- margin:.24rem auto;
- display:block;
- }
- .w-header-right{
- width: 3.435rem;
- height:3.429rem;
- float:right;
- }
- .w-header-right a{
- width: 3.435rem;
- height:3.429rem;
- display:block;
- background:url(../images/home.png) no-repeat center center;
- background-size: 2rem;
- }
- .trade-nav {
- width: 100%;
- height: 736px;
- margin-top: 3.429rem;
- }
- .trade-nav-l {
- width: 23%;
- height: 100%;
- padding-bottom: 15%;
- box-sizing: border-box;
- background: #F4F5FA;
- float: left;
- overflow-y: scroll;
- }
- .trade-nav-l ul li.on {
- background: #fff;
- }
- .trade-nav-l ul li {
- height: 3.475rem;
- line-height: 3.475rem;
- font-size: 1.25rem;
- color: #333;
- text-align: center;
- position: relative;
- }
- .trade-nav-l ul li.on:after {
- border-left: 0.165rem solid #ee0f15;
- }
- .trade-nav-l ul li:after {
- content: '';
- height: 3.475rem;
- width: 0.165rem;
- background: #F4F5FA;
- position: absolute;
- left: 0;
- top: 0;
- }
- .trade-nav-r {
- width: 75%;
- height: 100%;
- float: right;
- margin: 2% 0 2% 0%;
- overflow-y: scroll;
- padding-bottom: 20%;
- }
- .trade-nav-r .trade-list-box {
- display: none;
- }
- .trade-nav-r .trade-list-box.on {
- display: block;
- }
- .trade-list-box {
- width: 100%;
- height: 100%;
- display: none;
- }
- .trade-list-box .trade-title {
- font-size: 1.25rem;
- color: #333;
- padding: 4% 0 2% 0;
- text-align: left;
- }
- .trade-list a {
- width: 31%;
- height: 2.985rem;
- color: #333;
- text-align: center;
- line-height: 2.985rem;
- border: 0.01rem solid #D4D7E9;
- float: left;
- margin-right: 2%;
- margin-top: 2.5%;
- overflow: hidden;
- }
- .mob-navigation {
- z-index: 9999;
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- /* padding: 0 50px;
- padding-top: 90px;*/
- background: #fff;
- opacity: 0;
- transform: scale(0);
- -webkit-transform: scale(0);
- -moz-transform: scale(0);
- -ms-transform: scale(0);
- -o-transform: scale(0);
- text-align: center;
- transition: all 0.3s ease;
- -webkit-transition: all 0.3s ease;
- -moz-transition: all 0.3s ease;
- -ms-transition: all 0.3s ease;
- -o-transition: all 0.3s ease;
- }
- .mob-navigation.on {
- opacity: 1;
- transform: scale(1);
- -webkit-transform: scale(1);
- -moz-transform: scale(1);
- -ms-transform: scale(1);
- -o-transform: scale(1);
- }
- .mob-navigation li a {
- display: block;
- line-height: 50px;
- font-size: 16px;
- border-bottom: 1px solid #eee;
- }
- .mob-navigation li:last-child a {
- border-bottom: 0;
- }
- .mob-navigation i {
- position: absolute;
- right: 20px;
- top: 20px;
- font-size: 40px;
- color: #666;
- -webkit-text-stroke: 5px #fff;
- }
- /* */
- .linkCon {
- padding: 10px;
- }
- .linkCon ul {
- width: 104%;
- }
- /* foot */
- footer {
- margin-top: 30px;
- }
- .foot-nav {
- line-height: 30px;
- }
- .foot-nav ul li {
- padding: 0 4px;
- }
- .ftlx-box {
- padding: 0 20px;
- }
- .ftlx-box .fr {
- width: 100%;
- margin-top: 20px;
- }
- .ftlx-box .fr span {
- margin-left: 0;
- margin-right: 20px;
- }
- footer p {
- margin-top: 30px;
- padding: 20px;
- }
- .bgf {
- margin-top: 0;
- padding: 0 10px 30px 10px;
- }
- }
|