@charset "utf-8"; * { margin: 0; padding: 0; color: #000; font-size: 14px; } img { display: block; } ul { list-style: none; } a { text-decoration: none; cursor: pointer; outline: none } body { color: #f5f5f5 } .head { position: relative; width: 100%; background: #3aaaf8; border-bottom: 1px solid #ddd; height: 48px; z-index: 9999; } .container { margin: 0 auto; width: 1220px; } .block { padding: 20px 0; } .index{ width: 85%; margin: 0 auto; } .logo{ float: left; z-index: 999993; position: absolute; } /* 主菜单 */ .header{ width: 100%; height: auto; display: inline-block; padding: 22px 0; position: absolute; z-index: 9; } .navbox { float: right; width: 54%; } .m_img{ display: none; } .nav { display: block; float: left; width: 100%; } .head .nav .nav_pc { width: 100%; } .nav ul li { float: left; position: relative; box-sizing: border-box; z-index: 999; } .nav ul li:first-child { } .nav ul li .f_a { line-height: 48px; display: block; text-align: center; font-size: 17px; color: #383838; font-weight: bold; } .nav ul li:hover .f_a { background-color: #cf1322; color: #fff; transition: all .3s } .nav ul li .s_navbox { display: none; position: absolute; left: 0; width: 100%; background-color: #00a2ff; z-index: 9999; box-sizing: border-box } .nav ul li .s_navbox .s_a a { color: #fff; font-size: 14px; text-transform: uppercase; display: block; text-align: center; padding: 10px 0; border-top: 1px solid #fff; } .nav ul li .s_navbox .s_a a:hover { background-color: #cf1322; color: #fff; } .m_nav { display: none } .headlf .m_logo { display: none } .headrg .m_menuimg { display: none } .active { background-color: #cf1322 } .activ2 { background-color: #cf1322 } /* 下拉侧边菜单 */ .sidenav { position: relative; width: 180px; display: block; float: left; } .sidenav label { width: 180px; display: block; padding-left: 55px; box-sizing: border-box; background: #128ee3; position: relative; height: 48px; line-height: 48px; color: #fff; font-size: 16px; } .sidenav label i { width: 30px; height: 30px; display: block; position: absolute; background-size: 20px; left: 25px; top: 16px; } .sidenav .side { display: inline-block; position: absolute; top: 48px; left: 0; z-index: 999; width: 180px; background: #fff; border-top: none; background-color: rgba(255, 255, 255, .95); box-sizing: border-box; } .sidenav .side li { position: relative; width: 100%; padding: 5px 0px; border-bottom: 1px solid #cccccc; box-sizing: border-box } .sidenav ul.side li:first-child { cursor: pointer; } .sidenav .side li a { color: #333; height: 40px; line-height: 40px; padding: 8px 0 8px 0; display: block; font-size: 16px; } .sidenav .side li a:hover { background: none; color: #0085cd; } .sidenav .side li a i { transition: all 0.3s ease 0s; } .sidenav .side li a i.side_t { margin-left: 10px; width: 40px; height: 40px; display: inline-block; vertical-align: middle; background-size: 30px; } .sidenav .side li a:hover i { margin-left: 15px; } .icon1 { background: url(../images/sideicon1.png) no-repeat; } .icon2 { background: url(../images/sideicon1.png) no-repeat; } .icon3 { background: url(../images/sideicon1.png) no-repeat; } .icon4 { background: url(../images/sideicon1.png) no-repeat; } .icon5 { background: url(../images/sideicon1.png) no-repeat; } .icon6 { background: url(../images/sideicon1.png) no-repeat; } .icon7 { background: url(../images/sideicon1.png) no-repeat; } .sidenav .side li:hover .side_main { display: block; z-index: 999; } .sidenav .side .side_main { display: none; width: 500px; background: #FFFFFF; position: absolute; left: 180px; top: 0; box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1); border: 1px #cecece solid; z-index: 7; } .sidenav .side .side_main dl { margin: 20px; padding: 0; } .sidenav .side .side_main dl dt { font-size: 18px; margin-bottom: 10px; color: #0173b2; font-weight: bold; } .sidenav .side .side_main dl dt b { font-size: 15px; } .sidenav .side .side_main dl dd { margin-bottom: 10px; display: inline-block; } .sidenav .side .side_main dl dd a { position: relative; display: inline-block; color: #777; font-size: 14px; margin: 0 4px; padding: 0 5px; border-right: 2px solid #bbbbbb; height: auto; line-height: 1.5; transition: all 0.2s ease 0s; } i.icon-hot,i.icon-new { display: inline-block; height: 9px; width: 24px; background: url(../images/img_public.png) no-repeat; vertical-align: middle; } i.icon-hot { background-position: 0 -240px; } i.icon-new { background-position: -40px -240px; } .sidenav .side .side_main dl dd a span { color: #999; } .sidenav .side .side_main dl dd a:hover { background: none; color: #cf1322; transform: translateY(-2px); } .sidenav .side .side_main dl dd a:hover b { color: #40adf5; } .sidenav .side .side_main dl dd a:hover span { color: #40adf5; } /* 轮播图 */ .slider { margin-top: -2%; overflow: hidden; width: 100%; top: 0px; } .slideBox .hd { height: 10px; z-index: 1; overflow: hidden; position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 1; } .slideBox .hd ul { text-align: center; padding-top: 5px; } .slideBox .hd ul li { cursor: pointer; float: left; margin-right: 5px; width: 30px; height: 10px; line-height: 14px; text-align: center; background: #fff; } .slideBox .hd ul .on { background: #00a2ff; color: #fff; } .slideBox .bd { position: relative; z-index: 0; } .slideBox .bd li img { width: 100%; vertical-align: top; } .footer{ width: 100%; height: auto; display: inline-block; position: relative; background-image: url(../images/footer.jpg); background-repeat: no-repeat; background-size: cover; padding: 5% 0; padding-bottom: 4%; margin-top: -6%; } .f-left{ float:left; margin-top: 4%; width: 25%; } .f-logo{ width: 100%; margin-bottom: 7%; } .f-logo img{ width: 100%; } .f-left ul{ width: 100%; height: auto; display: inline-block; margin-top: 6%; } .f-left li{ width: 100%; height: auto; display: inline-block; margin-bottom: 10%; } .f-left li img{ float: left; margin-right: 3%; } .f-left li p{ font-size: 15px; color: #fff; margin-left: 5%; } .f-center{ width: 45%; float: left; margin-left: 5%; margin-top: 4%; } .f-center ul{ float: left; margin-left: 27%; } .f-center h3{ font-size: 23px; letter-spacing: 2px; color: #fff; margin-bottom: 24%; } .f-center li{} .f-center li a{ color: #fff; font-size: 15px; line-height: 36px; } .f-right{ float: right; margin-top: 4%; } .f-right img{} .f-right p{ text-align: center; font-size: 15px; color: #fff; margin-top: 11%; } .pagess { width: 100%; display: flex; justify-content: center; margin: 20px 0; } .paginator { display: flex; align-items: center; gap: 5px; } .paginator .page-start:not([href]), .paginator .page-next:not([href]) { color: #999; cursor: not-allowed; background-color: #f9f9f9; border-color: #eee; } .paginator .page-start, .paginator .page-next { padding: 5px 10px; } .paginator a { display: inline-block; padding: 5px 12px; border: 1px solid #ddd; border-radius: 3px; text-decoration: none; color: #333; font-size: 14px; transition: all 0.3s ease; } .paginator .page-num-current { background-color: #337ab7; color: white; border-color: #337ab7; font-weight: bold; } /*小于1600大于1200稍微调整下字体*/ @media screen and (max-width: 1600px) and (min-width:1200px) { .nav ul li .f_a { font-size: 16px; } .nav ul li .s_navbox .s_a a { font-size: 12px } .foot_top ul { margin-left: 60px } .nav ul li .s_navbox .s_a { width: 100% } } /*移动端导航*/ @media screen and (max-width: 1024px) and (min-width: 0px) { .msgNum { display: none; } .slider { margin-top: 23px; } .head { display: none } .headlf img{ width: 100%; } .m_img { display: block;cccccccccccc height: 44px; background: #fff; position: fixed; top: 0px; left: 0px; width: 100%; z-index: 9999; border-bottom: 1px solid #ddd; overflow: hidden; } .m_img .headlf { padding-top: 6px; padding-left: 5px; float: left; width: 47%; }【了。。。。。。。。。。。。。。。。。。。。。。1 .m_nav .closeicon img{ width: 37%; } .m_img .headlf .m_logo { height: 40px; display: block } .m_logo img{ width: 100%; } .m_img .headrg { padding-right: 5%; padding-top: 14px; float: right; } .m_img .headrg a .m_menuimg { height: 16px; vertical-align: top; display: block } .m_nav { display: block; position: fixed; top: 0px; left: 0px; width: 0px; height: 0px; overflow: hidden; z-index: 10000 } .m_nav .closecover { position: absolute; width: 100%; height: 100%; background: #0b0d19; filter: alpha(opacity=0); opacity: 0; left: 0px; top: 0px; z-index: 1 } .m_nav .closeicon { position: absolute; width: 20%; left: 30px; top: 5%; z-index: 100; text-align: center; filter: alpha(opacity=0); opacity: 0 } .m_nav .m_navList { position: absolute; width: 80%; right: 0px; top: 0px; background: #0b0d19; height: 100%; z-index: 100; right: -80%; overflow-y: scroll; } .m_nav .m_navList ul { padding-left: 5%; padding-right: 5% } .m_nav .m_navList ul li { border-bottom: 1px solid #232530 } .m_nav .m_navList ul li a { display: block; height: 45px; color: #fff; line-height: 45px; padding-left: 5%; font-size: 16px } .m_nav .m_navList ul li .m_f_a { display: flex; align-items: center; justify-content: space-between; width: 100% } .m_nav .m_navList ul li .m_f_a a { flex: 1; } .m_nav .m_navList ul li .m_f_a i { width: 40px; height: 35px; box-sizing: border-box; padding: 0 5px; display: block; } .icon { background: url(../images/plus.png) 100% no-repeat; background-position: 50% 50%; -webkit-transition: all 0s; -moz-transition: all 0s; transition: all 0s } .icon_on { background: url(../images/reduce.jpg) 50% no-repeat!important; background-position: 50% 50%; -webkit-transition: all 0s; -moz-transition: all 0s; transition: all 0s } .m_nav .m_navList ul li .m_s_nav { display: none; width: 100%; } .m_nav .m_navList ul li .m_s_nav a { display: block; height: 40px; line-height: 40px; font-size: 14px; padding-left: 10%; overflow: hidden; white-space: nowrap; width: 90%; text-overflow: ellipsis; } } .fb a { display: none; } @media screen and (max-width: 1024px) and (min-width: 0px) { .header{ display:none; } .f-left { float: left; margin-top: 8%; width: 100%; } .f-logo { width: 100%; margin-bottom: 1%; } .f-right { float: none; text-align: center; margin: 0 auto; display: block; } .f-right img { text-align: center; margin: 0 auto; } .f-right p { text-align: center; font-size: 15px; color: #fff; margin-top: 4%; } .paginator a { display: inline-block; padding: 5px 12px; border: 1px solid #ddd; border-radius: 3px; text-decoration: none; color: #333; font-size: 11px; transition: all 0.3s ease; } .fb a { position: fixed; bottom: 0px; text-align: center; display: inline-block; color: white; background-color: #0054a7; width: 100%; z-index: 999999; padding: 11px 0; font-size: 16px; letter-spacing: 1px; } .closeicon img{ width: 40%; } }