/*页眉*/ .header { width: 100%; position: relative; } .header .banner { position: relative; width: 100%; } .header .banner img.sec_banner{ display: block; width: 100%; height: auto; } .header .position-box { position: absolute; width: 100%; left: 0; top: 0; border-bottom: solid 1px rgba(255, 255, 255, 0.1); z-index: 99; padding-top: 10px; padding-bottom: 10px; } .header .position-box .content { width: 1400px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; } .header .position-box .content .logo { width: 255px; height: 64px; } .header .position-box .content .logo img { display: block; width: 100%; } .header .position-box .content .nav { width: 800px; } .header .position-box .content .nav ul { width: 100%; display: flex; justify-content: space-between; } .header .position-box .content .nav ul li { position: relative; font-size: 18px; font-weight: 600; color: #fff; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .header .position-box .content .nav ul li a { display: block; color: #fff; padding: 40px 15px; line-height: 18px; } .header .position-box .content .nav ul li:hover a { color: #fff; background-color: rgba(0,0,0,.5); } .header .position-box .content .nav ul li .sec_nav{ position: absolute; top: 100%; left: 0; width: 100%; height: 0; overflow: hidden; background-color: rgba(0,0,0,.5); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .header .position-box .content .nav ul li:hover .sec_nav{ height: auto; } .header .position-box .content .nav ul li .sec_nav .items a{ display: block; width: 100%; text-align: center; font-size: 15px; padding: 15px 0; color: rgba(255,255,255,.8); border-bottom: solid 1px rgba(255, 255, 255, 0.1); } .header .position-box .content .nav ul li .sec_nav .items a:hover{ color: #fff !important; } .header .position-box .content .nav_menu { display: none; width: 32px; height: 32px; } .header .position-box .content .nav_menu img { display: block; width: 100%; } .nav_h5 { display: none; } .main-content { position: relative; width: 100%; z-index: 9; } .footer { width: 100%; padding-top: 40px; background-color: #04287E; } /*页脚*/ .footer .content { width: 1400px; margin: 0 auto; } .footer .content .contact { width: 100%; display: flex; padding-bottom: 40px; justify-content: space-between; border-bottom: solid 1px rgba(255, 255, 255, 0.1); } .footer .content .contact .left { width: calc(100% - 375px); display: flex; justify-content: flex-start; } .footer .content .contact .left li { margin-right: 65px; } .footer .content .contact .left li h3 { font-size: 18px; line-height: 36px; color: #fff; font-weight: 600; margin-bottom: 5px; } .footer .content .contact .left li h3 a { display: block; color: #fff; } .footer .content .contact .left li .second_menu { width: 100%; } .footer .content .contact .left li .second_menu .list { font-size: 14px; line-height: 42px; color: #fff; } .footer .content .contact .left li .second_menu .list a { color: #fff; } .footer .content .contact .right { width: 375px; } .footer .content .contact .right .top { display: flex; width: 100%; justify-content: space-between; padding-bottom: 15px; margin-bottom: 15px; border-bottom: solid 1px rgba(255, 255, 255, 0.1); } .footer .content .contact .right .top .item { width: 150px; text-align: center; } .footer .content .contact .right .top .item span { display: block; font-size: 14px; color: #fff; margin-top: 10px; } .footer .content .contact .right .top .item img { display: block; width: 150px; } .footer .content .contact .right .bottom .labels, .footer .content .contact .right .bottom .info { font-size: 14px; line-height: 42px; color: #fff; } .footer .content .contact .right .bottom h3 { font-size: 36px; line-height: 42px; color: #fff; margin-bottom: 15px; } .footer .content .contact .right .bottom_h5 { display: none; } .footer .content .contact .right .bottom_h5 .info { font-size: 14px; line-height: 42px; color: #fff; } .footer .content .copyright { width: 100%; padding: 40px 0; text-align: center; font-size: 14px; color: rgba(255, 255, 255, 0.6); } /*分页*/ .page{ width: 100%; display: flex; justify-content: center; align-items: center; } .page ul{ display: flex; justify-content: center; align-items: center; } .pagination>li>a, .pagination>li>span{ width: 40px; height: 40px; border-radius: 40px; padding: 0; line-height: 38px; } .pagination>li:first-child>a, .pagination>li:first-child>span{ border-top-left-radius: 40px; border-bottom-left-radius: 40px; } .pagination>li:last-child>a, .pagination>li:last-child>span{ border-top-right-radius: 40px; border-bottom-right-radius: 40px; } .page ul li{ width: 40px; height: 40px; border-radius: 100%; text-align: center; line-height: 38px; font-size: 14px; /* border: solid 1px #04287E; */ margin: 0 14px; color: #aaa; cursor: pointer; /* background-color: #fff; */ } .page ul li:hover{ color: #E83D3A; } .page ul li.cur{ color: #fff; border-color: #04287E; background-color: #04287E; } @media only screen and (min-width:1280px) and (max-width:1440px) { .header .position-box .content, .footer .content { width: 1200px; } .footer .content .contact .left li { margin-right: 45px; } .footer .content .copyright { padding: 30px 0; } } @media only screen and (min-width:0) and (max-width:640px) { .header .position-box .content, .footer .content { width: 100%; padding: 0 15px; } .header .position-box .content .logo { width: auto; height: 32px; } .header .position-box .content .logo img { display: block; width: auto; height: 32px; } .header .position-box .content .nav { display: none; } .header .position-box .content .nav_menu { display: block; cursor: pointer; } .header .banner img.sec_banner{ min-height: 180px; object-fit: cover; } /*nav-导航菜单*/ .nav_h5 { display: block; position: fixed; right: -90%; top: 0; background-color: #3a3a3a; width: 90%; height: 100%; z-index: 100; padding: 20px; } .j-close { position: absolute; top: 15px; right: 15px; width: 32px; height: 32px; cursor: pointer; } .j-close img { display: block; width: 100%; } .nav_h5 ul { width: 100%; height: auto; margin-top: 20px; } .nav_h5 ul li { position: relative; border-bottom: solid 1px #727272; padding: 20px 0; } .nav_h5 ul li a.fir-menuList { display: flex; justify-content: flex-start; font-size: 14px; color: #fff; text-align: left; } .nav_h5 ul li a.fir-menuList:link{ text-decoration: none; } .nav_h5 ul li a.fir-menuList:focus{ text-decoration: none; } .nav_h5 a.fir-menuList img { margin-left: 5px; display: block; width: 16px; height: auto; } .has_rotate { transform: rotate(180deg); -ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari and Chrome */ -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -ms-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear; } .no_rotate { transform: rotate(0); -ms-transform: rotate(0); /* IE 9 */ -webkit-transform: rotate(0); /* Safari and Chrome */ -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -ms-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear; } .nav_h5 .second-menu { display: none; position: absolute; left: 0; top: 56px; width: 100%; height: auto; z-index: 10; } .nav_h5 .second-menu .list { width: 100%; height: auto; } .nav_h5 .second-menu a.second-menuList { display: block; width: 100%; height: auto; padding: 15px 10px; font-size: 14px; color: #555; background-color: #fff; border-bottom: solid 1px #e3e3e3; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; } .nav_h5 .second-menu a.second-menulist:link, .nav_h5 .second-menu a.second-menulist:hover{ text-decoration: none; background-color: #04287E; color: #fff; } .nav_h5 .second-menu a.second-menulist:focus { background-color: #04287E; color: #fff; } .banquan { position: absolute; bottom: 20px; left: 20px; font-size: 14px; color: #fff; } .footer { padding-top: 30px; } .footer .content .contact .left { display: none; } .footer .content .contact, .footer .content .contact .right { width: 100%; } .footer .content .contact .right .top { justify-content: center; } .footer .content .contact .right .top .item { margin: 0 15px; width: 120px; } .footer .content .contact .right .top .item img { display: block; width: 100%; } .footer .content .contact .right .bottom { display: none; } .footer .content .contact .right .bottom_h5 { display: block; } .footer .content .contact .right .bottom_h5 .info { font-size: 12px; line-height: 28px; text-align: center; } .footer .content .contact { padding-bottom: 20px; } .footer .content .copyright { font-size: 12px; padding: 15px 0; } .page ul li{ width: 36px; height: 36px; line-height: 34px; margin: 0 6px; } } /*置顶*/ .sidebar { display: none; width: 40px; height: 40px; position: fixed; bottom: 8%; right: 15px; z-index: 999; } .sidebar .side { width: 40px; height: 40px; cursor: pointer; background: url(../img/icon/back.png) center center no-repeat; background-color: #626262; background-size: 25px 25px; }