.wrap { padding: 0 6%; width: 100%; } .header-phone{display: none;} .header{ width: 88%; height:90px; /*padding:0 6%;*/ margin:0 auto; background-color: #fff; } .header .left{ width:80%; } .header .right { width: 20%; margin-top:15px; } .header .s-nav a.enBtn { display: inline-block; width: 30px; height: 17px; background: url(../images/en.jpg) no-repeat center; margin-top: 10px; } .header .s-nav a.search-btn { display: inline-block; width: 18px; height: 17px; background: url(../images/ico_114.png) no-repeat center; margin-top: 10px; } .header .s-nav .line { display: inline-block; float: right; color: #e5e5e5; width: 32px; text-align: center; } .header .s-nav { width: 100%; margin-top: 18px; line-height: 40px; height: 40px; } .header .s-nav a { float: right; color: #333; line-height: 36px; font-size: 14px; } .header .s-nav a.en { font-family: "Arial"; font-size: 12px; color: #333; } .header .s-nav2 { width: 100%; margin-top: 18px; line-height: 40px; height: 40px; display: none; } .header .logo{ height: 60px; width: 500px; margin-top:20px; float: left; } .header .logo img{display: block; height:60px;} .header .nav{ float: left; } .header .nav ul li{ float: left; margin-right:30px; transition: all 0.3s; -webkit-transition: all 0.3s; position: relative; } .header .nav ul li:last-child{margin-right: 0} .header .nav ul li .title{ font-size: 16px; font-weight:bold; line-height: 33px; color: #666; display: block; width: 100%; padding:36px 1px; height: 100%; position: relative; text-decoration: none; } /*.header .nav ul li .title:before{ content: ''; width:0%; height: 2px; position: absolute; bottom: 30px; left: 50%; display: block; background-color: #0778e3; transition: all ease-in 0.3s; -webkit-transition: all ease-in 0.3s; } .header .nav ul li:hover .title:before{ left:-1px; width: 100%; }*/ .header .nav ul li .details{ top: 105px; left: 0; background-color: #fff; position: absolute; width: 240px; display: none; z-index: 50; border-top: 3px solid #035cac; } .header .nav ul li .details a{ display: block; padding-left: 25px; line-height: 50px; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; font-size: 16px; color: #666; background-color: #fff; } .header .language{ width:20%; float: right; height: 33px; padding: 36px 0; font-size: 14px; line-height: 33px; color: #888; } .header .language .en{ float: right; font-size: 14px; color: #888; margin-left: 20px; cursor: pointer; text-decoration: none; } .header .language .en:hover,.header .nav ul li .details a:hover{ color: #006cb8; } .header .language .links{ float: left; } /*header phone*/ .header-phone{ display: none; padding: 0 4.5%; /*height: 105px;*/ margin: 0 auto; background-color: #fff; position: relative; } .header-phone .logo{ height:33px; width: 201px; float: left; padding: 36px 0; } .header-phone .logo a{ display: block; width: 100%; height:100%; } .header-phone .logo a img{ display: block; width: 100%; } .header-phone .serch{ float: right; height: 100%; padding: 32.5px 0; } .header-phone .serch .langue,.header-phone .serch .lines{ float: left; } .header-phone .serch .langue{ font-size: 34px; text-align: center; font-family: 'arial'; line-height: 40px; color: #666666; margin-right: 40px; } .header-phone .serch .langue a { color:#006cb8; } .header-phone .serch .lines{ width: 50px; height: 40px; position: relative; cursor: pointer; } .header-phone .serch .lines p{ width:50px; height:4px; background-color: #006cb8; border-radius:2px; position: absolute; left: 0; -webkit-transition: all 0.8s; transition: all 0.8s; } .header-phone .serch .lines p:nth-child(1){ top: 0px; -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: rotateZ(0deg); -ms-transform: rotateZ(0deg); transform: rotateZ(0deg); -webkit-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } .header-phone .serch .lines.cur p:nth-child(1) { -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .header-phone .serch .lines p:nth-child(2){ top: 17px; -webkit-transition: all 0.5s; transition: all 0.5s; } .header-phone .serch .lines.cur p:nth-child(2) { opacity: 0; } .header-phone .serch .lines p:nth-child(3){ top: 33px; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotateZ(0deg); -ms-transform: rotateZ(0deg); transform: rotateZ(0deg); -webkit-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } .header-phone .serch .lines.cur p:nth-child(3){ -webkit-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } .header-phone .tip-nav{ width: 100%; position: absolute; top: 105px; left: 0; z-index: 40; display: none; background: #fff; } .header-phone .tip-nav ul{margin-bottom: 0; width:100%;} .header-phone .tip-nav li{ border-bottom: 1px solid #aaa; border-right: 1px solid #035cac; width:100%; } .header-phone .tip-nav li .title{ color: #fff; display: block; width: 100%; padding: 0 17% 0 5%; font-size: 18px; height: 55px; line-height: 55px; color: #fff; cursor: pointer; border-right: 1px solid #035cac; background-color: #035cac; position: relative; } .header-phone .tip-nav li:hover .title{text-decoration: none;} /*.header-phone .tip-nav li .title i{ display: block; width: 34px; height: 55px; background: url(../images/ico_100.png) no-repeat center; background-size: auto 21%; position: absolute; right: 20px; top: 0; }*/ .header-phone .tip-nav li .details{ width: 100%; background-color: #004888; display: none; } .header-phone .tip-nav li .details a{ display: block; width: 100%; padding: 0 17.4% 0 4.6%; height: 48px; line-height: 48px; border-top: 1px solid #5484af; color: #fff; font-size: 16px; } .header-phone .tip-bg{ position: fixed; background-color: rgba(0,0,0,0.8); top: 0; left: 0; z-index: 3; height: 100%; width: 100%; display: none; } .header-phone .tip-serch{ width: 91%; position: absolute; top:100px; left: 4.5%; height: 40px; display: none; z-index: 4; } .header-phone .tip-serch form{ display: block; width: 100%; height: 100%; border:1px solid #f2f2f2; box-sizing:border-box; } .header-phone .tip-serch form .tet{ float: left; width: 85%; float: left; height: 38px; line-height: 38px; font-size: 14px; box-sizing:border-box; padding: 0 5%; color: #fff; border:0; background-color: transparent; } .header-phone .tip-serch form .sub-btn{ width: 15%; height: 38px; float: right; background: url(../images/page-serch.png) center no-repeat; background-size: auto 55%; border:0; } .header-phone .tip-serch .close{ wimg49.jpgidth: 35px; height: 35px; background: url(../images/close.png) center no-repeat; position: fixed; top: 30px; right: 4.5%; cursor: pointer; z-index: 4; background-size: auto 86%; } .header-phone .langue a{ float:left} .header-phone .langue .en{ float:right} .header-phone .langue .search{ width:35px; height:35px; float: right; margin-right:15px; background: url(../images/search.png) center no-repeat; } /****************底部***************/ .footer{ background:#272727; width:100%;} .footer.m-footer { display: block; } .footer.recruit-m-footer .footer-main { background-color: #045dac; padding-bottom: 0; } .recruit-m-footer .footer-main.m-wrap dd:last-child { border-bottom: 1px solid #1e6eb4; } .recruit-m-footer .footer-main.m-wrap dt { border-bottom: 1px solid #1e6eb4; } .recruit-m-footer .footer-main dd a { color: #a4bad8; } .footer.m-footer.recruit-m-footer .m-botwrap { background-color: #045dac; } .footer.m-footer.recruit-m-footer .m-botwrap .botbox p { color: #dde5f0; } .footer.m-footer.recruit-m-footer .m-botwrap .botlink a { color: #dde5f0; } .footer.m-footer.recruit-m-footer .m-botwrap .botlink .line { color: #1e6eb4; width: 24px; } .footer-main { padding-top: 28px; padding-bottom: 24px; background-color: #272727; } .footer-main .wx-link { display: none; } .footer-main .m-search-box { display: none; } .footer-main.m-wrap { padding: 10px 4.7% 20px; width: 90.6%; } .footer-main.m-wrap .m-search-box { margin-top: 18px; width: 99%; border: 1px solid #393939; height: 30px; margin-bottom: 15px; } .footer-main.m-wrap .m-search-box .tex { width: 81%; height: 15px; line-height: 14px; font-size: 14px; color: #fff; padding: 8px 4% 7px; background: none; border: none; } .footer-main.m-wrap .m-search-box .sub-btn { border: none; width: 10%; height: 30px; background: url(../images/ico_15.png) no-repeat center; background-size: auto 35%; } .footer-main.m-wrap .wx-link { display: inline-block; padding-left: 28px; line-height: 18px; height: 18px; color: #fff; background: url(../images/ico_26.png) no-repeat left center; background-size: auto 100%; } .footer-main dl { float: left; /*margin-right: 18%;*/ /*margin-right: 11%;*/ margin-right: 10%; transition: all 0.5s ease 0s; margin-bottom: 15px; } .footer-main.twrap dl { margin-right: 6%; } .footer-main.m-wrap .left-wrap { width: 100%; } .footer-main.m-wrap dl { width: 100%; margin-right: 0; margin-bottom: 0; } .footer-main dt { font-size: 14px; line-height: 24px; margin-bottom: 8px; } .footer-main.m-wrap dt { line-height: 38px; border-bottom: 1px solid #393939; color: #fff; /*background: url(../images/ico_25.png) no-repeat 96% center; background-size: auto 40%;*/ cursor: pointer; } .footer-main.m-wrap dt.hover { /*background: url(../images/ico_27.png) no-repeat 96% center; background-size: auto 40%;*/ } .footer-main dt a { color: #ccc; display: block; } .footer-main dt a:hover { color: #fff; } .footer-main.m-wrap dd { display: none; } .footer-main.m-wrap dd:last-child { border-bottom: 1px solid #393939; padding-bottom: 6px; } .footer-main dd a { color: #b0b0b0; line-height: 29px; font-size: 14px; } .footer-main.m-wrap dd a { font-size: 12px; display: block; } .footer-main dd a:hover { color: #fff; } .footer-main .right { width: 18%; padding-top: 9px; } .footer-main.m-wrap .right { display: none; } .footer-main.m-wrap .searchbox { display: block; } .footer-main .searchbox { width: 99%; height: 40px; border: 1px solid #393939; margin-bottom: 30px; } .footer-main .searchbox .tex { border: none; background: none; width: 81%; height: 15px; font-size: 14px; line-height: 14px; padding: 13px 3% 12px 3%; color: #fff; } .footer-main .searchbox .butn { border: none; width: 13%; height: 40px; background: url(../images/ico_15.png) no-repeat center; background-size: auto 40%; } .footer-main .wxbox { width: 50%; margin-left: 7%; } .footer-main .wxbox img { width: 100%; } .footer-main .wxbox p { text-align: center; line-height: 32px; color: #fff; } .footer-main .left-wrap { /*width: 42%;*/ width: 80%; } .footer .secbox { height: 28px; line-height: 28px; padding-top: 11px; padding-bottom: 11px; background-color: #000; } .footer .secbox a { color: #b0b0b0; } .footer .secbox a:hover { color: #fff; } .footer .secbox .left a { float: left; } .footer .secbox .line { display: inline-block; width: 22px; text-align: center; color: #333; } .footer .secbox .left .line { float: left; } .footer .secbox .right a { float: right; } .footer .secbox .right .line { float: right; } .footer .thibox { padding-top: 15px; padding-bottom: 18px; background-color: #000; color: #b0b0b0; line-height: 28px; } .footer .thibox .link { width: 240px; position: relative; } .footer .thibox.twrap .link { width: 186px; } .footer .thibox .tit { display: block; width: 238px; height: 33px; border: 1px solid #333; line-height: 33px; text-align: center; color: #878787; background: url(../images/ico_16.png) no-repeat 160px center; cursor: pointer; } .footer .thibox.twrap .tit { width: 186px; background: url(../images/ico_16.png) no-repeat 160px center; } .footer .thibox .link:hover .tit { background: url(../images/ico_17.png) no-repeat 160px center; } .footer .thibox .subbox { position: absolute; bottom: 35px; left: 0; width: 238px; border-left: 1px solid #333; border-right: 1px solid #333; background-color: #000; z-index: 2; display: none; transition: normal; } .footer .thibox.twrap .subbox { width: 186px; } .footer .thibox .subbox ul { width: 100%; } .footer .thibox .subbox li { position: relative; width: 100%; border-top: 1px solid #333; } .footer .thibox .subbox a { display: block; width: 100%; line-height: 33px; text-align: center; color: #878787; } .footer .thibox .subbox a.tt { margin-left: -6px; padding-right: 6px; position: relative; z-index: 2; } .footer .thibox .subbox li:hover a.tt { background: url(../images/bg_52.png) no-repeat left center; } .footer .thibox .second-level { width: 238px; position: absolute; bottom: 0; left: -240px; border-left: 1px solid #333; border-right: 1px solid #333; display: none; z-index: 1; } .footer .thibox .second-level a { display: block; width: 100%; line-height: 33px; text-align: center; color: #878787; background-color: #1c1c1c; border-top: 1px solid #333; } .footer .thibox .second-level a:hover { background-color: #333; } .footer .m-botwrap { display: none; } .footer.m-footer .secbox, .footer.m-footer .thibox { display: none; } .footer.m-footer .m-botwrap { display: block; background-color: #000; padding-bottom: 25px; } .footer.m-footer .m-botwrap .topbox { width: 100%; padding-top: 16px; padding-bottom: 12px; line-height: 25px; text-align: center; border-bottom: 1px solid #1a1a1a; } .footer.m-footer .m-botwrap .topbox .line { display: inline-block; width: 8px; text-align: center; color: #333; } .footer.m-footer .m-botwrap .topbox a { color: #b0b0b0; } .footer.m-footer .m-botwrap .botbox { padding-top: 10px; } .footer.m-footer .m-botwrap .botbox p { line-height: 27px; text-align: center; color: #b0b0b0; } .footer.m-footer .m-botwrap .botlink { width: 100%; text-align: center; line-height: 27px; } .footer.m-footer .m-botwrap .botlink a { color: #b0b0b0; } .footer.m-footer .m-botwrap .botlink .line { display: inline-block; width: 8px; text-align: center; color: #333; } .footer.m-footer .bot-linkbox { width: 41%; height: 24px; border: 1px solid #333; margin: 10px auto 0; position: relative; display: none; } .footer.m-footer .bot-linkbox .tt { display: block; width: 100%; line-height: 24px; color: #b0b0b0; text-align: center; background: url(../images/ico_16.png) no-repeat 90% center; background-size: auto 28%; cursor: pointer; } .footer.m-footer .bot-linkbox .tt.hover { background: url(../images/ico_17.png) no-repeat 90% center; background-size: auto 28%; } .footer.m-footer .bot-linkbox .subbox { position: absolute; bottom: 26px; width: 99%; border-left: 1px solid #333; border-right: 1px solid #333; background-color: #000; display: none; transition: normal; } .footer.m-footer .bot-linkbox .subbox a { width: 100%; display: block; height: 24px; line-height: 24px; border-top: 1px solid #333; text-align: center; color: #b0b0b0; transition: normal; } @media screen and (max-width: 1628px) { .header .nav ul li { float: left; margin-right:25px; transition: all 0.3s; -webkit-transition: all 0.3s; position: relative; } .header .logo { display: block; width: 380px; height: 50px; float: left; margin-top:25px; } .header .logo img { height: 50px; } } @media screen and (max-width: 1380px){ .header .logo { display: block; width:310px; height: 40px; float: left; margin-top: 30px; } .header .nav ul li{ margin-right:15px} .header .logo img { height: 40px; } .header .nav ul li .title { font-size: 14px; font-weight: bold; line-height: 33px; color: #666; display: block; width: 100%; padding: 36px 1px; height: 100%; position: relative; text-decoration: none; } .header .nav ul li .details a { display: block; padding-left: 25px; line-height: 50px; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; font-size: 14px; color: #666; background-color: #fff; } } @media screen and (max-width: 1200px){ .header .nav ul .none { display: none; } .header { width: 94%; height: 90px; margin: 0 auto; } .header .nav ul li { margin-right: 10px; } .header .left { width: 75%; } .header .right { width: 25%; } .header .logo { display: block; width: 295px; height: 40px; float: left; margin-top: 30px; } .header .nav ul li .title{ font-size:13px;} } @media screen and (max-width: 1024px){ .header{ display:none} .header-phone, .base-title .mian { display: block; } .header-phone .logo { height: 60px; width: 390px; float: left; margin-top: 15px; padding:0; } } @media screen and (max-width: 768px){ .header-phone .logo { width: 250px; float: left; } /*.header-phone .serch { padding: 30px 0; }*/ .header-phone .langue .search { width: 18px; height: 18px; float: right; margin-right: 10px; background: url(../images/search.png) center no-repeat; background-size: cover; } .header-phone .tip-nav{top: 72px;} .header-phone .serch .langue{ font-size: 18px; text-align: center; font-family: 'arial'; line-height: 20px; color: #666666; margin-right:10px; } .header-phone{ padding: 0 4.5%; /*height: 52px;*/ display: block; } .header-phone .serch .langue,.header-phone .serch .lines{ float: left; } .header-phone .serch .lines{ width:25px; height: 20px; } .header-phone .serch .lines p{ width:25px; height:2px; } .header-phone .serch .lines p:nth-child(2){top: 9px;} .header-phone .serch .lines p:nth-child(3){ top: 17px;} .header-phone .serch .lines.cur p:nth-child(3){ -webkit-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } .header-phone .tip-nav li .title{ font-size: 15px; height: 35px; line-height: 35px; } .header-phone .tip-nav li .title i{ height: 35px; } .header-phone .tip-nav li .details a{ height: 28px; line-height:28px; font-size: 13px; } } @media screen and (max-width: 480px){ .header-phone .logo { width: 220px; float: left; margin-top: 18px; padding: 0 } } @media screen and (max-width: 374px){ .header-phone .logo { width: 200px; float: left; margin-top: 18px; padding: 0; } .header-phone .langue .search { width: 18px; height: 18px; float: right; margin-right: 5px; background: url(../images/search.png) center no-repeat; background-size: cover; } }