 @media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
 .mobx {
display: block!important;
}
.pcx {
display: none!important;
}
.mob_muhead {
transition: all 0.8s;
}
.muuuhead-m .muuweb-logo {
float: left;
margin: 6px 0 0 10px;
display: block;
transition: all 0.8s;
height:45px;
}
.muuweb-logo img {
display: block;
height:45px;
}
.muuuhvam {
float: right;
}
 .muuuhead-m {
top: 0;
box-shadow: 0 5px 10px rgba(0,0,0,.05);
left: 0;
z-index: 1000;
position: fixed;
background: #fff;
width: 100%;
height: 80px;
transition: all 0.8s;
}
.muuuhead-m .bg {
position: fixed;
top: 70px;
right: 0;
bottom: 0;
width: 100%;
height: 100vh;
z-index: 99;
background: #000;
opacity: .5;
filter: alpha(opacity=10);
cursor: pointer;
transform: scaleX(0);
transform-origin: 100% 50%;
transition: transform 0.6s;
}
.muuuhead-m .menu-box {
position: absolute;
z-index: 9999;
padding: 27px 20px 25px;
right: 0;
transition: all 0.6s;
}
.muuuhead-m .menulists {
width: 25px;
margin: 0 auto;
cursor: pointer;
}
.muuuhead-m .menulists .line {
position: relative;
top: 0;
display: block;
width: 100%;
height: 2px;
transition: transform 0.3s ease, top 0.3s ease, width 0.3s ease, opacity 0.3s, background 0.3s;
transform-origin: center center;
background: #021253;
}
.muuuhead-m .menulists .line:nth-child(2) {
margin: 6px 0;
}
.muuuhead-m.ishow {
}
.muuuhead-m.ishow .bg {
transform: scaleX(1);
}
.muuuhead-m.ishow .muuuhvam li .link {
transform: translateX(0px);
opacity: 1
}
.muuuhead-m.ishow .muuuhvam li .hider.ishow {
transform: translateX(-101%)
}
.muuuhead-m.ishow .muuuhvam li .hider.ishow .sub-link .text {
transform: translateX(0px);
opacity: 1
}
.muuuhead-m.ishow .menu-box {
right: 0;
}
.muuuhead-m.ishow .menulists .line:nth-child(1) {
top: 8px;
transform: rotate(45deg);
opacity: 0.8;
}
.muuuhead-m.ishow .menulists .line:nth-child(2) {
opacity: 0;
width: 0
}
.muuuhead-m.ishow .menulists .line:nth-child(3) {
top: -8px;
transform: rotate(-45deg);
opacity: 0.8;
}
.muuuhead-m .muuuhvam {
position: fixed;
top: 70px;
right: 0;
opacity: 0;
bottom: 0;
overflow-y: auto;
padding-top: 0;
width: 0;
z-index: 99;
background: #f9f9f9;
cursor: pointer;
transition: .36s ease-in-out;
-webkit-transition: .36s ease-in-out;
transform-origin: 100% 50%;
}
.muuuhead-m.ishow .muuuhvam {
transform: scaleX(1);
width: 70%;
opacity: 1;
}
.muuuhead-m .muuuhvam li {
padding-left: 5%;
overflow: hidden;
position: relative;
border-bottom: 1px solid #ebebeb;
}
.muuuhead-m .muuuhvam li:nth-child(1) {
border-top : 1px solid #ebebeb;
}
.muuuhead-m .muuuhvam li .hide {
position: absolute;
top: 0;
left: 101%;
z-index: 1001;
width: 100%;
height: 100%;
background-color: #fff;
transition: all 0.8s;
}
.muuuhead-m .muuuhvam li .link {
position: relative;
display: inline-block;
line-height: 50px;
float: left;
text-align: left;
color: #222;
width: 90%;
font-size: 14px;
transition: all 0.6s;
opacity: 0;
}
.muuuhead-m .muuuhvam li .cur {
display: inline-block;
height: 50px;
width: 10%;
line-height: 50px;
color: #999;
text-align: center;
vertical-align: top;
font-size: 1rem;
transition: all .5s ease;
}
.muuuhead-m .muuuhvam li .hider {
display: none;
}
.muuuhead-m.ishow .muuuhvam li .hider.ishow {
transform: translateX(-101%);
}
.muuuhead-m .muuuhvam li .conter {
}
.muuuhead-m .muuuhvam li .back {
display: block;
width: 10%;
height: 50px;
line-height: 50px;
text-align: center;
vertical-align: top;
font-size: 1rem;
transition: all .5s ease;
transform: rotateZ(180deg);
}
.muuuhead-m .muuuhvam li .hider .sub-link {
display: block;
padding: 2%;
border-bottom: 1px solid #ebebeb;
font-size: 13px;
color: #666;
text-align: left;
}
.muuuhead-m .muuuhvam li .jtRote {
transform: rotateZ(90deg);
}
.muuuhead-m .muuuhvam li .hider a:last-child {
border: none;
}
#mob_head .muuuhead .muuweb-logo {
float: left;
width: 300px;
transition: all 0.8s;
margin-top: 30px;
}
#mob_head .muuuhead .muuuhvam li .link {
display: block;
line-height: 45px;
font-size:.93rem !important;
padding: 0 18px;
color: #ffffff;
position: relative;
}
#mob_head .muuuhead ul li:hover a.link {
color: #fff;
background: none;
}
#mob_head .muuuhead .muuuhvam li .hider .sub-link {
display: block;
border-bottom: 1px solid rgb(255, 255, 255, 0.1);
font-size:.93rem !important;
color: #ffffff;
background: none;
}
#mob_head .muuuhead .muuuhvam li {
position: relative;
margin-top: 27px;
height: 100%;
display: inline-block;
text-align: center;
}
#mob_head {
width: auto;
max-width: none;
min-width: 0px;
height: auto;
max-height: none;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
padding-top: 0px;
padding-left: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
 .muuuhead-m .muuuhvam li i img {
height:24px;
margin-top:13px;
}


/*电脑*/
body {
 min-width: 100%;
width:100%
}
.swiper-container {
width: 100%;
height: auto;
background-color: #3d107b;
}
.swiper-slide {
text-align: center; /* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
width: 100%;
overflow: hidden;
padding-top: 60px;
}
.swiper-slide img {
height: auto;
width:100%
}
.npagePage .newsl .headers p.title {
 font-size: 16px;
 color: #3d107b;
 margin-bottom: 10px;
}
.w1200 {
 width: 100%;
 margin: auto;
}
 .ableft {
 float: none;
 width: 96%;
margin:auto
}
.ableft .muti {
 padding-top: 20px;
 text-align: center;
}
.ableft .entitle {
 font-size: 14px;
 width: 100%;
 border-bottom-width: 1px;
 border-bottom-style: solid;
 border-bottom-color: #f0f0f0;
 display: block;
 line-height: 30px;
 color: #CCC;
 margin-bottom: 10px;
}
#indexPage #mcontact {
 background-color: #333!important;
}
.ditum {
width:100%;
}
 a.morex {

 width: 110px;
 height: 36px;
 line-height: 36px;
 display: block;
 color: #FFF;
 text-align: center;
 font-size: 14px;
 border-radius: 5px;
 margin-top: 20px;
margin:auto
}
.abright {
 float: none;
 width: 100%;
}
.map01 {
 width: 47%;
 height: auto;
 margin-top: 10px;
margin-left:2%;
float:left
}
.abright img {
 width: 100%;
 height: auto;
 border: 0px solid #FFF;
}
 .map02 {
 width: 47%;
 height: auto;
 float: right;
 margin-top: 0px;
margin-right:2%;
margin-top: 10px;
}
 .oproduct li {
 float: left;
 width: calc(50% - 7px);
 margin-right: 10px;
 margin-bottom: 10px;
}
 .oproduct li:nth-child(2n) {
margin-right:0px;
}
 #indexPage #mproject .content .header {
 padding-top: 10px;
 margin: 0 auto;
 width: 100%;
 text-align: center;
}
#indexPage #mproject .content .subtitle {
 display: block;
 width: 100%;
 color: rgba(191, 191, 191, 0.91);
 font-size: 14px;
 margin: 0 auto;
 padding-bottom: 0px;
 margin: 0 auto;
}
.content .header p.title {
 font-size: 18px;
 color: #444;
 margin-bottom: 0px;
}
.content .header {
padding-bottom:20px;
}
#indexPage #mproject .content .wrapper {
 width: 100%;
 margin: 0 auto;
}
#indexPage #mproject #muuectlist .projectitem {
 transition: all ease-out .3s;
 width: 47%;
 height: auto;
 margin: 0 0 0 0px;
 overflow: hidden;
margin-left:2%
}
#muuectlist .projectitem {
 position: relative;
 background: #fff;
}
#indexPage #mproject #muuectlist .projectitem .project_img {
height:130px;
overflow:hidden
}
#indexPage #mproject #muuectlist .projectitem a .project_info div {
 height: 50px;
 top: 130px;
 width: 100%;
}
 #indexPage #mproject #muuectlist .projectitem a .project_info .title {
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
 height: 50px;
 line-height: 50px;
 text-align: center;
 margin: 0px;
padding:0 0;
}
 #indexPage #mnews .content .header {
 display: block;
 padding:20px 0 10px;
 text-align: center;
}
#indexPage #mnews {
 height: auto;
width:100%;
margin:auto
}
#indexPage #mnews .content {
 width:96%  margin: 0 auto;
}
#newslist, #newslist .wrapper, #indexPage #mnews .content_list {
 height: 100%;
}
#mnews #newslist .newstitem {
 width: 100%;
 float: left;
}
#mnews #newslist {
 width:100%;
 margin: 0 auto;
}
#mnews #newslist li:nth-child(1) {
display:none
}
 #indexPage #mnews #newslist .newstitem {
 margin:auto;
 transition: all 0.3s ease-out 0s;
 height: 46px;
}
 #mnews #newslist li.newstitem {
width:calc(96% - 40px);
margin:auto;
float:none;
margin-left:20px;
}
#indexPage #mnews a.more {
 background: rgba(255,255,255,.0);
 background-color: rgba(255, 255, 255, 0);
 width: 150px;
 height: 37px;
 display: block;
 margin: 10px auto 10px;
 line-height: 37px;
 font-size: 14px;
 color: rgba(95, 95, 95, 0.66);
 border-radius: 2px;
 transition: all ease-out .3s;
 background-color: #fff;
 text-align: center;
}
 #indexPage #mcontact .content {
 width: 100%;
 margin: 0 auto;
 padding: 30px 20px 20px;
 height: auto;
}
#indexPage #mcontact .content #contactlist {
 width: 100%;
 float: left;
}
#mcontact .content #contactinfo p {
 float: none;
 width: 90%;
}
#contactinfo h3 {
 margin-bottom: 10px;
}
#mcontact .content #contactinfo p {
 margin-top: 4px;
}
#footer p {
 width: 90%;
 margin: 0 auto;
 height: 44px;
 line-height: 44px;
 padding: 0;
 text-align: left;
}
 .npagePage #banner {
 padding-top: 60px;
 height: 120px;
}
.npagePage #banner div {
background-size:auto 120px;
background-repeat: no-repeat;
background-position: center top;
}
 .npagePage .content {
 width: 100%;
 margin: 0 auto;
}
.npagePage .newsl {
 width: 96%;
 float: none;
 padding-top: 0px;
 margin-top: 20px;
 padding-bottom: 50px;
margin:auto
}
.npagePage .postbody {
 width: 100%;
 text-align: left;
TEXT-JUSTIFY: inter-ideograph;
TEXT-ALIGN: justify;
}
 .Pageanli #muuectlist {
 margin-top: 0px;
width: 100%;
float: none;
}
h5.typename {
 font-size: 18px;
}
.npagePage #muuectlist .wrapper {
 margin-left: 20px;
 display: inline-block;
 width: auto;
margin-right:20px;
}
 #webtent .Pageanli #muuectlist .projectitem {
 width:calc(50% - 5px);
 margin: 0 5px 10px 0;
 background: none;
}
#webtent .npagePage #muuectlist .projectitem:nth-child(3n) {
 margin-right: 0;
}
 #webtent .npagePage #muuectlist .projectitem:nth-child(2n) {
 margin-right: 0px;
float:right
}
#mproject.npagePage #muuectlist .project_img {
 width: 100%;
 height: auto;
}
#mproject.npagePage #muuectlist .projectitem a img {
 width: 100%;
 height: auto;
}
 .lxww {
 padding-left: 20px;
 font-size: 14px;
 line-height: 30px;
padding-bottom:30px
}
 .Pagenews #newslist {
 width: 96%;
 float: none;
 padding-top: 0px;
 margin-top: 0px;
margin:auto;
}
h5.typename {
 font-size: 22px;
 margin-bottom: 20px;
padding-left:10px;
}
 #newsPage.Pagenews #newslist .newstitem {
 width: 100%;
 margin: 0;
 height: 90px;
 border-bottom: 1px solid rgba(0, 0, 0, .06);
overflow:hidden;
margin-bottom:10px
}
 .Pagenews #newslist .newstitem .newsimg {
 display: block;
 width: 120px;
 height: 80px;
 margin-top: 0px;
}
 .Pagenews #newslist .wrapper .news_wrapper {
 width:calc(100% - 130px);
 float: right;
 position: static;
 margin-left: 0px;
}
#newsPage #newslist #newsitem_0 .newsbody {
 width: 100%;
}
.Pagenews #newslist #newsitem_0 .newsbody {
 top: 0px;
 margin-top: 0px;
}
.Pagenews #newslist #newsitem_0 .newsbody .title {
 margin-top: 5px;
}
.Pagenews #newslist #newsitem_0 .newsbody .details {
display:none
}
.Pagenews #newslist .newsbody .title {
 left: 135px;
 width:  100%;
 margin-top: 0px;
 line-height: 24px;
 height: auto;
word-wrap: break-word;
 word-break: normal;
}
.postbody img {
 max-width: 100%;
}
}
@media (min-width: 1200px) {
.muuuhead-m { display: none; }
}
@media (max-width: 1200px) {
.muuuhead { display: none; }
.muuuhead-m { height: 70px; }
}
@media (max-width: 768px) {
.muuuhead-m .stock { left: 10px; }
}
@media (max-width: 500px) {
.muuuhead-m { height: 60px; }
.muuuhead-m .menu-box { padding: 21px 15px; transition: all 0.6s; }
.muuuhead-m .muuuhvam { padding: 0; top: 60px; background: #f9f9f9; }
.muuuhead-m .bg { display: none; }
.muuuhead-m.ishow .muuuhvam { transform: scaleX(1); width: 100%; opacity: 1; }
.muuuhead-m .muuuhvam li .cur { width: 20%; }
.muuuhead-m .muuuhvam li .link { width: 80%; }
}
.mob_muhead >div { animation-fill-mode: both; }/*图片标题列表*/
 @-webkit-keyframes scaleUpDown { from {
-webkit-transform: scale(1.1);
transform: scale(1.1) translateZ(0);
}
to { opacity: 1; -webkit-transform: scale(1); transform: scale(1) translateZ(0); }
}
@keyframes scaleUpDown { from {
-webkit-transform: scale(1.1);
transform: scale(1.1) translateZ(0);
}
to { opacity: 1; -webkit-transform: scale(1); transform: scale(1) translateZ(0); }
}
 @-webkit-keyframes colorSlide { 0% {
height:0;
}
90% {
height:40px;
}
}
@keyframes colorSlide { 0% {
height:0;
}
90% {
height:40px;
}
}
@-webkit-keyframes trackBallSlide { 0% {
opacity: 1;
-webkit-transform: scale(1) translateY(-8px);
transform: scale(1) translateY(-8px);
}
34% {
opacity: 1;
-webkit-transform: scale(0.9) translateY(4px);
transform: scale(0.9) translateY(4px);
}
68% {
opacity: 0;
-webkit-transform: scale(0.4) translateY(16px);
transform: scale(0.4) translateY(16px);
}
100% {
opacity: 0;
-webkit-transform: scale(0.4) translateY(-8px);
transform: scale(0.4) translateY(-8px);
}
}
@keyframes trackBallSlide { 0% {
opacity: 1;
-webkit-transform: scale(1) translateY(-8px);
transform: scale(1) translateY(-8px);
}
34% {
opacity: 1;
-webkit-transform: scale(0.9) translateY(4px);
transform: scale(0.9) translateY(4px);
}
68% {
opacity: 0;
-webkit-transform: scale(0.4) translateY(16px);
transform: scale(0.4) translateY(16px);
}
100% {
opacity: 0;
-webkit-transform: scale(0.4) translateY(-8px);
transform: scale(0.4) translateY(-8px);
}
}
@-webkit-keyframes nudgeMouse { 0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(8px);
transform: translateY(8px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes nudgeMouse { 0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(8px);
transform: translateY(8px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
 @-moz-keyframes three-quarters-loader { 0% {
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes three-quarters-loader { 0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes three-quarters-loader { 0% {
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
