@font-face { font-family: 'Arial'; src: url('../fonts/fzcqk.ttf') format('truetype'); font-weight: normal; } /* 移动端 */ .gp-menu-nav, .gp-menu-header-icon-out>span { /* background-color: #fff; */ } .gp-ser { height: 16px; } .gp-search { line-height: 16px; border-radius: 16px; /* margin-top: 9px; */ } .gp-search input.notxt { color: #a4a4a4; width: 67%; left: 0; height: 20px; outline: none; padding-left: 9%; } .navout { position: absolute; width: 100%; z-index: 100 } .navout::before { content: ''; display: block; width: 100%; height: 220px; background: rgba(0, 0, 0, .7); background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .7), rgba(.7, 0, 0, 0)); /* Safari 5.0 - 6.0 */ background: -o-linear-gradient(bottom, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(bottom, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); /* Firefox 3.6 - 15 */ background: linear-gradient(to bottom, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); position: absolute; left: 0; top: 0; } .gp-search .notxt1 { position: absolute; width: 28%; right: 0px; height: 20px; top: -3px; cursor: pointer; color: #fff; } /* 头部 */ header { /* padding-top: 38px; */ background: url(../images/headerbg.png) no-repeat; background-size: cover; position: relative; /* overflow: hidden; */ z-index: 100; /* position: fixed; */ width: 100%; } .headertop::before { content: ''; display: block; width: 397px; height: 46px; background: url(../images/zi.png) no-repeat; position: absolute; left: 53%; top: 55px; } .htopRight { /* width: 96px; */ height: 20px; border-radius: 3px; background: rgba(0, 0, 0, .1); margin-top: 20px; padding: 10px; } .headertop { /* padding-bottom: 15px; */ /* padding-top: 28px; */ overflow: hidden; padding: 30px 0; position: relative; } .Eng { display: inline-block; margin-left: 10px; margin-right: 20px; vertical-align: middle; } .gp-search { border-left: 1px solid rgba(255, 255, 255, .2); vertical-align: middle; } .gp-search2.active { width: 140px; height: 22px; line-height: 22px; border: 1px solid #ccc; } /* 导航 */ .nav ul li:hover .subNav { -webkit-animation-name: flipInY; animation-name: flipInY; animation-duration: 0.6s; -webkit-animation-duration: 0.6s; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; visibility: visible !important; display: block; } @keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .nav li>a { line-height: 18px; color: #fff; font-size: 18px; position: relative; display: block; /* font-weight: bold; */ padding: 15px 58px; /* padding-bottom: 33px; */ } .nav ul li:first-child a { padding-left: 0px; } .nav ul li:last-child a { padding-right: 0px; } .nav li.on>a { font-weight: bold; } .nav li.on .subNav { display: block; } .nav li { /* padding: 20px 0px; */ position: relative; display: block; z-index: 50; float: left; } .nav li:first-child { text-align: left; } .nav li.on a { color: #fff; position: relative; } /* .nav li.on::before { content: ''; display: block; width: 80px; height: 4px; position: absolute; left: calc(50% - 40px); bottom: 7px; background: #01306a; z-index: 200; } */ .nav li.on::after { content: ''; display: block; width: 10px; height: 11px; position: absolute; left: calc(50% - 5px); bottom: 0px; background: url(../images/navbg1.png) no-repeat; z-index: 200; } .nav li:first-child.on::before { left: 0; } .nav li:first-child.on::after { left: calc(30% - 5px); } .nav li:last-child.on::before { left: 40%; } .nav li:last-child.on::after { left: 69%; } .nav li span.gp-f12 { line-height: 45px; } .subNav { background: #013c85; /* background: -webkit-linear-gradient(bottom, rgba(158, 6, 8, 48), rgba(158, 6, 8, 0)); */ /* Safari 5.1 - 6.0 */ /* background: -o-linear-gradient(bottom, rgba(158, 6, 8, 48), rgba(158, 6, 8, 0)); */ /* Opera 11.1 - 12.0 */ /* background: -moz-linear-gradient(bottom, rgba(158, 6, 8, 48), rgba(158, 6, 8, 0)); */ /* Firefox 3.6 - 15 */ /* background: linear-gradient(to bottom, rgba(158, 6, 8, 48), rgba(158, 6, 8, 0)); */ left: 0px; width: calc(100% - 15px); padding: 15px; top: 48px; z-index: 1000; } .nav li:last-child .subNav { /* right: 2px !important; */ left: -22px; } .gp-menu-nav { background: #004387; } /* footer */ footer { background: #004387; overflow: hidden; } .footertop { overflow: hidden; border-bottom: 1px solid rgba(216, 216, 216, .43); padding: 35px 0; } .footer li { width: calc(25% - 2px); display: block; float: left; border-right: 1px solid rgba(255, 255, 255, .43) !important; } .footer li:last-child { border-radius: none; border-right: none!important; } .footer li p.gp-f16 { line-height: 21px; } .center { text-align: center; } .right { text-align: right; } .footerbottom { line-height: 21px; text-align: center; padding: 15px 0; } .logo1, .logo { vertical-align: middle; display: inline-block; } .logo1 { width: 239px; } .logo { width: 288px; margin-left: 20px; } footer { background: url(../images/footerbg.png) no-repeat; background-size: cover; padding-top: 54px; } .footertLe { width: 40%; border-right: 1px solid rgba(255, 255, 255, .1); } .footerlogs a { display: block; float: left; } .flogo { width: 225px; } .flogo1 { width: 227px; margin-left: 10px; } .footerlogs { padding-bottom: 44px; overflow: hidden; display: inline-block; margin-bottom: 25px; border-bottom: 1px solid rgba(255, 255, 255, .1); } .footerlPs { line-height: 20px; color: rgba(255, 255, 255, .7); } .footertMed { width: calc(40% - 100px); padding: 0 100px; border-right: 1px solid rgba(255, 255, 255, .1); } .friends { line-height: 20px; color: rgba(255, 255, 255, .7); margin-bottom: 4px; } .footerUl li a { font-size: 14px; line-height: 27px; color: rgba(255, 255, 255, .7); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; } .footerUl li { width: 50%; float: left; } .footertRig { width: 12%; } .footerTop { overflow: hidden; padding-bottom: 45px; } .ewmImg { width: 100px; height: 100px; } .ewm p { line-height: 20px; color: rgba(255, 255, 255, .7); text-align: center; } .footerBottom { background: rgba(0, 0, 0, .2); padding: 20px 0; text-align: center; } .footerBottom p { font-size: 14px; display: inline-block; line-height: 20px; color: rgba(255, 255, 255, .7); } header.current { display: none; } header.current+.navout { box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); position: fixed; left: 0; top: 0; height: 50px; width: 100%; background-color: #244da0; /* margin-bottom: 0; */ } header.current+.navout::before { display: none; } .navout2 { position: relative; background-color: #244da0; } .navout2::before { display: none; } .banner li img { -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); transition: all 8s ease-in-out; } .banner li.slick-active img { transition: all 8s ease-in-out; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } @media screen and (max-width:1700px) {} @media screen and (max-width:1460px) { .footertMed { width: calc(40% - 77px); padding: 0 77px; border-right: 1px solid rgba(255, 255, 255, .1); } .nav li>a { padding: 5px 40px; padding-bottom: 33px; } .nav li:last-child .subNav { left: -17px; } } @media screen and (max-width:1400px) {} @media screen and (max-width:1301px) { .flogo { width: 190px; } .flogo1 { width: 180px; margin-left: 10px; } .logo1 { width: 223px; } .logo { width: 200px; } .headertop::before { background-size: 222px 26px; } .gp-container { width: 1000px; } .nav li>a { padding: 15px 25px; /* padding-bottom: 33px; */ } .nav li:last-child .subNav { left: -8px; } .subNav { padding: 25px 10px; width: calc(100% - 20px); } .nav li:last-child .subNav { left: 0px; } .nav li:last-child.on::before { left: 23%; } } @media screen and (max-width:1200px) {} @media screen and (max-width:1100px) { .footertRig { width: 17%; } .footertMed { width: calc(40% - 25px); padding: 0 25px; border-right: 1px solid rgba(255, 255, 255, .1); } .flogo { width: 175px; } .flogo1 { width: 157px; margin-left: 10px; } .gp-container { width: 900px !important; } .subNav { padding: 25px 5px; width: calc(100% - 10px); } .nav li:last-child .subNav { left: 5px; } .nav li:last-child.on::before { left: 23%; } .nav li>a { padding: 15px 18px; } } @media screen and (max-width:996px) { .footertLe { width: 100%; margin-bottom: 10px; } .footertMed { width: 100%; margin-bottom: 40px; border-right: 1px solid rgba(255, 255, 255, .1); } .footerlogs { display: block; padding-bottom: 10px; margin-bottom: 10px; } .gp-container { width: auto !important; margin-left: 30px; margin-right: 30px; } .footertRig { width: 100%; } .ewm { float: left; } .htopRight { display: none; } .htopRight2 { display: block; float: left; margin-left: 25px; } .gp-menu-nav { display: block !important; } .headertop::before { left: 66%; } .nav, .navout::before { display: none; } } @media screen and (max-width:767px) { .logo1 { width: 153px; } .logo { width: 128px; } .headertop::before { background-size: 105px 12px; top: 49px; left: 74%; } .gp-menu-header-icon { margin-top: -17px; transform: scale(0.8); } .gp-menu-header { display: block; top: 27px; } .footerUl li { width: 100%; } } @media screen and (max-width:479px) { footer { padding-top: 30px; } .hgroup { padding-top: 25px !important; } .mode1Lbottom li { padding: 15px 0 !important; } .warp-mode1, .warp-mode4 { padding-bottom: 15px !important; } .mode4Ul li p { height: auto; } .mode4Top { padding: 0 !important; } .footerTop { padding-bottom: 0; } .footertLe { width: 100%; margin-bottom: 15px; } .footertMed { margin-bottom: 0; padding: 0; } .flogo { width: 123px; } .flogo1 { width: 126px; margin-left: 10px; } .footerlogs { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid rgba(255, 255, 255, .1); } .bannerul li p { width: 50% !important; } .gp-menu-header { display: block; top: 3px; } .headertop::before { display: none; } .headertop { padding-bottom: 10px; padding-top: 15px; } .gp-menu-header-icon { margin-top: 10px; transform: scale(0.8); } } @media screen and (max-width:400px) { .logo1 { width: 124px; } .logo { width: 98px; } }