/* ========================================================================== Global ========================================================================== */ html { font-size: 62.5%; } a { color: #333; } a:hover { color: #e8450a; } a:focus { outline:none; -moz-outline:none; } body { color: #333; font: 14px/1.7 microsoft yahei, Arial, Helvetica, sans-serif; } .wrapper { max-width: 1100px; /*min-width: 980px; */ _width: 1100px; padding: 0 10px; margin-left: auto; margin-right: auto; } .wrapper:after, .row:after { content: ""; display: table; clear: both; } /* arrow */ .arrow { position: absolute; top: 50%; margin-top: -4px; } .arrow * { position: absolute; top: 0; left: 0; width: 0; height: 0; border: 0 dashed transparent; overflow: hidden; } /* arrow-right */ .arr-r * { border-left-style: solid; border-width: 4px 0 4px 4px; } .arr-r em { left: 1px; } .arr-r span { border-left-color: #3675bb; } .tri { position: absolute; width: 0; height: 0; border: 0 dashed transparent; overflow: hidden; } /* ================================== menu ================================== */ .menu { position: relative; } /* menu-hd */ .menu-hd { position: relative; z-index: 1002; overflow: hidden; height: 30px; line-height: 30px; padding: 0 20px 0 6px; } /* menu-bd */ .menu-bd { display: none; position: absolute; z-index: 1001; margin-top: -1px; } .menu-bd-panel { padding: 5px 0; border: 1px solid #eee; background: #fff; min-width: 96px; } .menu-bd-panel a { display: block; padding: 0 5px; line-height: 28px; white-space: nowrap; color: #6C6C6C } /* menu arrow */ .menu-hd .fa-caret-down { -webkit-transition: .3s ease-in; -moz-transition: .3s ease-in; -o-transition: .3s ease-in; transition: .3s ease-in; position: absolute; height: 30px; line-height: 30px; top: 0; right: 6px; } /* menu hover */ .menu-hover .menu-hd { z-index: 10002; } .menu-hover .menu-bd { z-index: 10001; } .menu-hover .menu-hd { padding: 0 19px 1px 5px; border-width: 0 1px; border-style: solid; border-color: #eee; background: #fff; } .menu-hover .menu-hd .fa-caret-down { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .menu-hover .menu-bd-panel a:hover { background: #eee; } /* ========================================================================== Header ========================================================================== */ header {} header .wrapper {position: relative; z-index: 99;} .logo { position: absolute; left:0;width:20%;height:90px; overflow: hidden;line-height:90px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .logo img{max-width: 100%; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .langbox{position: absolute;top: 10px;right: 40px; font-size: 12px;color: #353535;line-height: 24px;} .langbox a{} .langbox .fa{font-size: 16px;} .serchinco{position: absolute;width:40px; height: 24px; right:0; top:10px; font: 300 12px/24px microsoft yahei;cursor: pointer;z-index: 999; text-align: center;} .serchinco .fa{font-size: 16px;} .globalsearch{display: none;} .globalsearch{position: absolute; top: 85px; right:0;width: 280px;padding:15px;z-index: 99; background:#e8450a;} .globalsearch .warp{background: #fff;} .globalsearch #q{ float: left; border: 0 none; } .globalsearch .search-btn { float: right; border: 0 none; } .globalsearch #q { width: calc(100% - 70px); height: 18px; padding: 10px; line-height: 18px; background: #fff;border:1px solid #fff;font: 300 12px/18px microsoft yahei; } .globalsearch .search-btn { width: 40px;padding:0;margin:0; height: 40px; cursor: pointer; background: url(../images/btn_ser.png) no-repeat center;} @media only screen and (max-width: 480px) { .globalsearch{ width: calc(100% - 30px);} } @media only screen and (max-width:767px) { .serchinco{right: 48px; top:12px;} .globalsearch{ top:48px;} .logo,.toptel,.langbox{display: none;} .topbar{height: 0;} } /* ========================================================================== Nav ========================================================================== */ /* primary */ .globalnav { position: absolute; z-index: 999; right: 0; top: 16px; } .globalnav li { float: left; } .globalnav li a { display: block; color: #444; padding: 0 20px; font-size: 14px; line-height: 42px; font-family: microsoft yahei; } .globalnav .nav-sep { width: 2px; height: 42px; background: url(../images/nav-sep.gif) no-repeat 0; } .globalnav .active a, .globalnav li .active1 { color: #a6937c; } .dropdown { position: absolute; z-index: 999; background: #fff; background: rgba(255, 255, 255, .9); display: none; padding: 15px 20px; border-bottom: 3px solid #e8450a; margin-left: -45px; top: 100%; min-width: 120px; } .dropdown:after { content: ""; position: absolute; width: 0; height: 0; border: 0 dashed transparent; overflow: hidden; border-top-style: solid; border-width: 5px 5px 0; border-top-color: #31396f; left: 50%; margin-left: -5px; top: -5px; } .dropdown a { /* white-space: nowrap;*/ line-height: 30px; font-size: 14px; float: left; padding: 0; color: #000; background: none; border-bottom: 0 none; width: 100%; display: block; text-align: left; } #gn_01 .dropdown{ width: 200px;margin-left: -90px; } @media (max-width:767px) { .dropdown a { /* white-space: nowrap;*/ font-size: 16px; width: 100%; text-align: left; } .dropdown { min-width: calc(100% - 40px);} #gn_01 .dropdown{ width: calc(100% - 40px);;margin-left: 0; } } .dropdown a .fa { float: right; font-size: 12px; line-height: 30px; color: #999; } .dropdown a:hover .fa {color: #e8450a;} .dropdown a:hover{color: #e8450a;} /* ========================================================================== Content ========================================================================== */ .hidden {display: none;} /* ================================== banner ================================== */ .banner { overflow: hidden;margin-top:90px;position: relative;} .banner img{max-width: 100%;} .banner .mpic{ display: none;} .banner .txtbox{max-width: 1100px;margin:0 auto;} .banner .txtbox .mode{position: absolute;z-index: 99;} .banner .txt01{color: #283a4b;font-size: 24px;} #owl-banner .owl-nav{margin-top: 0;} #owl-banner .owl-dots{position: absolute;bottom: 10px;width: 100%;} #owl-banner .owl-prev,#owl-banner .owl-next{width:43px;bottom:10px; height:43px;background: none; text-indent: 100px;overflow: hidden;padding:0;margin:0; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; filter: Alpha(Opacity=100); opacity: 1; z-index: 99; } #owl-banner .owl-prev{position: absolute;right:60px; background:url(../images/bl.png) center bottom no-repeat;} #owl-banner .owl-next{position: absolute;right:10px;background:url(../images/br.png) center bottom no-repeat;} #owl-banner .owl-dots .owl-dot.active span, #owl-banner .owl-dots .owl-dot:hover span { background: #e8450a;width:30px; } #owl-banner .owl-dots .owl-dot span { width: 13px; height: 13px; background: #fff; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } @media only screen and (max-width: 767px) { #owl-banner .owl-prev,#owl-banner .owl-next{filter: Alpha(Opacity=0);opacity: 0;} .banner .txt01{font-size:18px;padding: 20px;line-height: 24px;font-weight: bold;} } @media only screen and (max-width: 767px) { .banner .mpic{ display: block;} .banner .pic{display: none;} .banner {margin-top:0;} } /* ========================================================================== hpart01 hxnl ========================================================================== */ .hpart01{padding:60px 0;} .hpart01 .txtarea{width: calc(100% - 720px);height: 420px; overflow: hidden; float: left;} .hpart01 .txtarea .desc{font-size: 14px; line-height: 30px; height: 180px; overflow: hidden;} .hpart01 .txtarea h3{ font-size: 30px; color: #e8410b; color: #e8410b; } .hpart01 .txtarea .line{width: 50px;height: 3px; background: #dbdbdb;margin:10px 0 20px 0;} .hpart01 .txtarea .more{margin-top: 50px; width: 220px;height: 65px; line-height: 65px; text-indent: 30px; overflow: hidden;border-left: 1px solid #ea5404;border-right: 1px solid #ea5404;} .hpart01 .txtarea .more a{color: #666;width: 100%;height: 100%;display: inline-block;} .hpart01 .txtarea .more .fa{color: #e61110;} .hpart01 .txtarea .more a:hover{color: #e61110;} .hpart01 .hhxys{width: 690px;height: 417px; overflow: hidden; float: right;} .hpart01 .hhxys .hxysbox{width: 225px;height: 417px; overflow: hidden;position: relative;float: left;margin-left: 5px;} .hpart01 .hhxys .hxysbox .cover{width: 100%;height: 100%; position: absolute;top: 0; left: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .hpart01 .hhxys .hxysbox .pic{width: 100%;height: 100%;overflow: hidden;} .hpart01 .hhxys .hxysbox .pic img{width: 100%;height: 100%;} .hpart01 .hhxys .hxysbox .cover h3{bottom: 0;position: absolute;width: 100%;height: 80px; line-height: 80px; color: #fff; font-size: 18px; text-indent: 20px; } .hpart01 .hhxys .hxysbox .cover .fa{color: #666;font-weight: normal; float: right;line-height: 80px;margin-right: 20px;} .hpart01 .hhxys .hxysbox:hover .cover{filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#CC495D8A', endColorstr='#CC495D8A');background:rgba(73,93,138,0.8);} .hpart01 .hhxys .hxysbox:hover .cover .fa{color: #fff;} @media only screen and (max-width: 920px) { .hpart01 .hhxys .hxysbox{width: 190px;height: 417px;} .hpart01 .hhxys{width: 600px;} .hpart01 .txtarea{width: calc(100% - 620px);} .hpart01 .txtarea .more{ width: calc(100% - 2px);} } @media only screen and (max-width: 767px) { .hpart01 .txtarea h3{text-align: center;font-size: 24px;} .hpart01 .txtarea .line{background: #dbdbdb;margin:10px auto 20px auto;} .hpart01 .txtarea{width:100%;float: none; height: auto;margin-bottom: 20px;} .hpart01 .txtarea .more {margin-top: 20px; height: 65px; line-height: 65px; text-indent: 0;border: 1px solid #ea5404; text-align: center;} .hpart01{padding:20px 0;} .hpart01 .hhxys{width: 100%;height: auto; overflow: hidden; float: none;} .hpart01 .hhxys .hxysbox{width: calc(100% - 2px);height:80px;border: 1px solid #495d8a;margin-left: 0;margin-bottom: 20px;} .hpart01 .hhxys .hxysbox .pic img{display: none;} .hpart01 .hhxys .hxysbox .cover h3{color: #495d8a; text-align: center;} .hpart01 .hhxys .hxysbox .cover .fa{float: none;line-height: 80px;} } /* ========================================================================== hpart02 jjfa ========================================================================== */ .fanganbox{width: 100%;height: 637px; overflow: hidden;position: relative;} .fanganbox .pic{width: 100%;height: 100%; position: absolute;z-index: -1;left: 0; top: 0;} .fanganbox .txtarea{max-width: 1100px; margin:0 auto;color: #fff;padding:0 10%;padding-top: 100px;} .fanganbox .txtarea h3{font-size: 24px;margin-bottom: 30px;} .fanganbox .txtarea .link a{color: #fff; margin-right: 50px;} .fanganbox .txtarea .more{margin-top: 80px; width: 220px;height: 65px; line-height: 65px; text-indent: 30px; overflow: hidden;border-left: 1px solid #6b7783;border-right: 1px solid #6b7783;} .fanganbox .txtarea .more a{color: #fff;width: 100%;height: 100%;display: inline-block;} .hjjfabox{position: relative;} .hjjfabox .hd{width: 100%;height:200px;position: absolute; left: 0; bottom: 0; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F000000', endColorstr='#7F000000');background:rgba(0,0,0,0.5); } .hjjfabox .hd ul{max-width: 1100px;margin:0 auto;color: #fff;} .hjjfabox .hd ul li{cursor: pointer;width: calc(25% - 1px);font-size: 18px;font-weight: bold; text-align: center; height: 200px; overflow: hidden; float: left ;border-right: 1px solid #6b7783;} .hjjfabox .hd ul li .inco{width: 80px;height: 80px;padding-top: 50px;padding-bottom: 10px; display: inline-block;} .hjjfabox .hd ul li.on{background: #e8410b;} .fatit{text-align: center;max-width: 250px;margin:0 auto;} .fatit h3{ font-size: 30px; color: #e8410b; } .fatit .line{width: 50px;height: 3px; background: #dbdbdb;margin:10px 0 20px 0;display: inline-block;} @media only screen and (max-width: 767px) { .fatit h3{ font-size: 24px;} .hjjfabox .hd ul{text-align: center;} .hjjfabox .hd ul li .inco,.hjjfabox .hd ul li p{display: none;} .hjjfabox .hd ul li{border: 0;width: 13px;height: 13px;background: #fff;margin:5px;float: none; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%;} .hjjfabox .hd{height: auto; background: none;} .fanganbox{width: 100%;height:300px;} .fanganbox .txtarea{padding:0 20px;padding-top: 30px;} .fanganbox .txtarea .more{margin-top: 20px; width: 120px;height: 30px; line-height: 30px; text-align: center;text-indent: 0;} } /* ========================================================================== hpart03 news ========================================================================== */ .hpart03{padding:60px 0 0 0;} .hpart03 .mode{height: 350px; float: left ;} .hpart03 .mode h3.tit{font-size: 24px;color: #283a4b;margin-bottom:30px;} .hpart03 .mode01{width: 300px;} .hpart03 .mode02 {width: calc(70% - 340px);float: left;margin:0 20px; } .hpart03 .mode03{width:30%;max-width: 330px; float: right;} .hyhdnews{width: 300px;height: 280px;border:1px solid #dcdcdc;overflow: hidden; position: relative;} .hyhdnews .pic{width: 100%;height: 100%;} .hyhdnews .pic img{width: 100%;height: 100%;} .hyhdnews li{width: 100%;height:100%;} .hyhdnews .txt01{height: 40px; line-height: 40px;color: #fff;position: absolute; bottom: 0;left: 0; width: 100%; font-size: 12px; font-weight: bold; text-indent: 10px; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#7F585858', endColorstr='#7F585858');background:rgba(88,88,88,0.5);} .hxwdt{width: calc(100% - 22px);height: 260px;padding:10px;border:1px solid #dcdcdc;overflow: hidden; background:url(../images/wefpic07.jpg) center bottom no-repeat;background-size: cover;} .ttiaobox img{width: 120px;height: 70px; float: left;margin-right: 15px;} .ttiaobox{margin-bottom: 20px;} .ttiaobox a{font-size: 16px; color: #212121; line-height: 18px;} .hxwdt li{width: 100%;height: 30px;line-height: 30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .hxwdt .more{margin-top: 20px; text-align: center;} .hxwdt .more a{color: #e8450a;} .hmap{width: 300px;height: 280px;border:1px solid #dcdcdc;overflow: hidden; position: relative;background-color: #eeeeee;} .hmap .pic img{width: 100%;height: 100%;} .hmap .more{text-align: center;position: absolute; left:0; bottom: 20px;width: 100%;} @media only screen and (max-width: 767px) { .hpart03 .mode{height: auto; float: none ;} .hpart03 .mode01{width: 100%;} .hyhdnews{width: 100%;border:1px solid #dcdcdc;} .hpart03 .mode02 {width: 100%;margin:20px 0 0 0; } .hpart03 .mode03{width:100%;max-width: 100%;margin:20px 0 0 0;} .hmap{width:100%;} .hpart03 .mode h3.tit{text-align: center; margin-bottom:30px;} .hpart03{padding:20px 0 0 0;} } /* ========================================================================== hpart04 gywm ========================================================================== */ .hpart04{padding:60px 0;} .hpart04 .txtarea{width: calc(40% - 20px); overflow: hidden; float: right;} .hpart04 .txtarea .desc{margin:20px 0;font-size: 14px; line-height: 30px; height: 150px; overflow: hidden;} .hpart04 .txtarea h3{font-size: 30px;margin-top: 60px;} .hpart04 .txtarea .more a{color: #e8450a;font-size: 18px;} .hpart04 .pic{width: 60%;max-width: 585px;float: left;} .hpart04 .pic img{max-width: 100%;} @media only screen and (max-width: 767px) { .hpart04{padding:20px 0;} .hpart04 .txtarea{width:100%;overflow: hidden; float: none;} .hpart04 .txtarea h3{font-size: 30px;margin-top:0; text-align: center;font-size: 24px;} .hpart04 .pic{width:100%;float: none;margin-top: 20px;} } /* ========================================================================== Footer ========================================================================== */ footer { color: #666; font-size: 12px; background: #f3f3f3; font-family: microsoft yahei; padding:60px 0 0 0;} footer a { color: #666; } footer a:hover { text-decoration: underline; } .footer-nav { text-align: justify; } .footer-nav:after { content: ""; width: 100%; display: inline-block; font-size: 0; line-height: 0; } .fn-col { display: inline-block; *display:inline; zoom: 1; vertical-align: top; *padding-right: 100px;} .fn-col h3 { margin-bottom: 10px; font: 700 14px/24px microsoft yahei;} .fn-col h3 a { color:#666;} .fn-col h3 a:hover {text-decoration: underline; } .fn-col ul {} .fn-col li { line-height:30px; font-size: 13px; } .fn-col li a { color: #666; } .fn-col li a:hover {text-decoration: underline;} .fn-colwx{width:300px;text-align: right;font-size: 16px;} .fn-colwx h3{font-size: 22px;color: #ccc;font-weight: normal;} .fn-colwx h3 a{color: #333;margin-right: 10px;} .fn-colwx .tel{font-size: 26px;color: #e8450a;font-weight: bold;} .ftlink{margin-top: 10px;} .ftlink .ewmbox,.ftlink .fshare{width: 55px;height: 55px; float: right;margin-left: 10px;cursor: pointer;} .ftlink .ewmbox{position: relative;} .ftlink .ewmbox .inco{width: 55px;height: 55px;} .ftlink .ewmbox:hover .bd{ display: block; } .ftlink .ewmbox .bd{display: none; width: 100px;height: 100px;position: absolute;padding:5px; background: #fff; right:55px;bottom:0; } .ftlink .ewmbox .bd img{width: 100px;} .foothd{text-align: center;padding:20px 0;text-transform:Uppercase;color: #fff; font-size: 14px; background: #283a4b;} .foothd a{color: #fff;} .foothd a:hover{color: #fff;} @media only screen and (max-width: 767px) { footer {padding-top: 30px;} .fn-col {width: calc(43% - 10px);padding-left:7%;} .fn-col ul{display: none;} .foothd{font-size: 12px;} .fn-colwx{display: none;} } .fixed-b { position: fixed; width: 100%; background: #333; bottom: 0; left: 0; display: none;z-index: 3; } .fixed-b li { width: 25%; text-align: center; color: #fff; float: left; } .fixed-b li a { display: block; border-right: 1px solid #454545; color: #fff; padding: 10px 0; } .fixed-b li .fa{font-size: 24px; line-height: 30px;} .fixed-b li:last-of-type a { border-right: 0 none; } .fixed-b li a .txt { display: block; margin-top: 5px; } @media only screen and (max-width: 767px) { .fixed-b { /*display: block; */} } .toggle-btn { display: none;} @media only screen and (max-width: 767px) { .toggle-btn { display: block; position: absolute; right: 20px; top: 10px; transition: all 0.5s; } .inner-cont > p img { width: 100%; height: auto; padding-bottom: 20px; } .gn-item:hover .toggle-btn { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } } #globalnav.mini_top .topbar{height: 30px; line-height: 30px;} #globalnav.mini_top .logo{height: 70px; line-height: 70px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } #globalnav.mini_top .logo img{height: 50px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } #globalnav.mini_top .serchinco{top:12px;} #globalnav.mini_top .globalsearch{top:70px; }