@charset "utf-8"; @media screen and (max-width:1470px){ header{ height:auto; } header h1{ margin-left: 20px; } header h1 a{ height: auto; } header .h-right > ul{ margin-right: 45px; } header .h-right div{ margin-right: 80px; } } @media screen and (max-width: 1200px){ header .h-right > ul > li > a{ padding: 24px 10px 20px; } } @media screen and (max-width: 1060px){ header .h-right > ul{ margin-right: 15px; } header .h-right div { margin-right: 15px; } } @media screen and (max-width: 970px){ header .h-right > ul > li > a{ font-size:14px ; } header h1{ width: 180px; } } @media screen and (max-width: 914px){ header .h-right > ul { margin-right: 10px; } header .h-right div { margin-right: 40px; } header .h-right > ul > li > a { padding: 24px 5px 20px; } } @media screen and (max-width:768px){ header .h-right > ul{ float: none; position: fixed; top: 0; right: -300px; height: 100%; width: 300px; margin-right: 0; background-color: rgba(255,255,255,.8); z-index: 2; transition: .3s; } header .h-right > ul > li:nth-child(1){ margin-top: 50px; } header .h-right > ul > li{ float: none; width: 70%; height: 45px; margin-left: 10px; text-align: left; line-height: 45px; white-space: nowrap; } header .h-right > ul > li > a{ color: #449c4a; font-size: 14px; padding: 0px 5px 0px; } header .h-right > ul > li .mnav{ } header .h-right > ul > li:hover > a { color: #449c4a; background-color: transparent; } header .h-right > ul > li > a.on{ background-color: transparent; color: #449c4a; } header .h-right > ul > li > a{ display: inline-block; vertical-align: middle; } header .h-right > ul > li i{ display: inline-block; width: 16px; height: 16px; margin-left: 10px; background: url("../img/xiala.png") no-repeat center/100%; vertical-align: middle; } header .h-right > ul > li .mnav{ margin-left: 60px; line-height: 25px; } header .h-right > ul > li .mnav li a{ color: #449c4a; font-size: 12px; } header .phonebtn{ display: block; top:50%; right: 0; width:42px; height:34px; margin: -17px 20px 0 0; background: url("../img/dao.png") no-repeat center/100%; z-index: 9; } header .h-right div i{ display: none; } header .h-right div{ right: 0px; top: 10px; margin-right: 80px; position: absolute; z-index: 3; color: #449c4a; } } @media screen and (max-width:700px){ header h1{ padding: 18px 0; } header h1 a{ width: 130px; } header .h-right ul { } } @media screen and (max-width: 414px){ header .h-right div { top: -8px; } }