@charset "utf-8";
/* Style Reset */
html{font-size:625%;-webkit-text-size-adjust:none;max-height:100%}
body{font-size: 0.16rem;}
body,p,h1,ul,li,input,img,figure,h3,h1,h2,dl,dd,dt{margin:0; padding:0;}
ul, ol, li, dl, dt, dd {list-style:none;}
a{text-decoration:none;outline:0px;}
fieldset, img {border:0;}
img{display:block;max-width: 100%}
input[type="text"],input[type="password"],input[type="submit"],input[type="reset"],input[type="button"],textarea{-webkit-appearance: none;}
.clear {clear:both;width:100%;}
/* common */
.content{min-height:7rem;overflow:hidden;font-size:0.16rem;padding-bottom: 15%;}

/* sub header */
.header{width:100%;height:0.8rem;position:relative;z-index:9999;}
.head{text-align: center;position:fixed;width:100%;height:0.8rem;top:0;right:0;box-shadow: 0 3px 0 rgba(182,0,5,100);line-height:0.8rem;z-index:99;-webkit-transition:all 0.3s ease-in-out 0s;-moz-transition:all 0.3s ease-in-out 0s;-ms-transition:all 0.3s ease-in-out 0s;transition:all 0.3s ease-in-out 0s;}
.head2{text-align: center;position:fixed;width:100%;height:0.45rem;top:0.8rem;right:0;line-height:0.45rem;z-index:99;-webkit-transition:all 0.3s ease-in-out 0s;-moz-transition:all 0.3s ease-in-out 0s;-ms-transition:all 0.3s ease-in-out 0s;transition:all 0.3s ease-in-out 0s;}
.nav-btn{width:14.0625%;right:1.09375%;top:0;position:absolute;height:100%;font-size:0.5rem;line-height:0.8rem;color:#FFFFFF;text-align:center;overflow:hidden;}
.home-btn{width:14.0625%;left:2.09375%;top:0;position:absolute;height:100%;font-size:0.3rem;line-height:0.45rem;color:#FFFFFF;text-align:center;overflow:hidden;display:block;}
.top-home{position:absolute;left:1.09375%;top:0;width:14.0625%;font-size:0.4rem;line-height:0.45rem;color:#fff;text-align:center;overflow:hidden;}
.top-title{width:50%;position: absolute;left:15.5%;top:0;font-size:0.3rem;line-height:0.45rem;text-align:left;color:#FFFFFF;overflow:hidden;}

/* footer */
.footer{width:100%;height:0.6rem;position:fixed;z-index:9999;bottom: 0; left: 0;
-webkit-transition:all 0.3s ease-in-out 0s;-moz-transition:all 0.3s ease-in-out 0s;-ms-transition:all 0.3s ease-in-out 0s;transition:all 0.3s ease-in-out 0s;}
.foot{width:100%;height:0.6rem;z-index:99; border-top:1px #c9c9c9 solid;}
.foot-relative{position:relative;width:100%; padding-top:0.02rem;height:0.6rem;-webkit-transition:all 0.3s ease-in-out 0s;-moz-transition:all 0.3s ease-in-out 0s;-ms-transition:all 0.3s ease-in-out 0s;transition:all 0.3s ease-in-out 0s;}
.foot a{display:block;float:left;width:24.5%;color:#0fa7ff;border-left:1px #c9c9c9 solid;}
.foot a span{display:block;width:100%;text-align:center;font-size:0.4rem;line-height:0.5rem;}
.foot a h3{width:100%;text-align:center;font:0.18rem/0.24rem "microsoft yahei"; color:#7C7D7F;}

/* subpage */
.about,.view{width:92.5%;margin:2% auto;font:0.22rem/2.0 "microsoft yahei";color:#1d1d1d;}
.about{text-align: left;}
.about img{display: inline-block;}
.view h1,.about h1{width:100%;text-align:center;font:0.3rem/0.5rem "microsoft yahei";color:#393939;}
.view img{max-width: 100%;display:inline}
.page{display:block;width:100%;height:0.38rem;font:0.2rem/0.38rem "microsoft yahei";color:#777;margin:2% auto;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;text-indent:0.1rem;}
.back{display:block;width:33.57%;margin:2% auto;height:0.4rem;border-radius:0.4rem;font:0.2rem/0.4rem "microsoft yahei";color:#FFFFFF;text-align:center;}

/* product */
.product-top{width:92.5%;margin:2% auto;border-bottom:1px solid #c9c9c9;height:0.5833rem;font:0.2rem/0.5833rem "microsoft yahei";color:#7b7b7b;}
.product-top p{float:left;}
.product-top a{font:0.3rem/0.5rem "microsoft yahei";color:#393939;}
.product-top p span{color:#3e74ce;font:0.2rem/0.5rem "microsoft yahei";}
.product-top-right{float:right;color:#7b7b7b}
.product-top-right a{font-size:0.3rem;color:#272727;vertical-align: middle}
.product-top-right a.show{color:#b60005 !important}

/* news */
.imore{display:block;width:36%;margin:2% auto;overflow:hidden;border-radius:0.8rem; border:1px #c9c9c9 solid;text-align:center; padding-top:3px;color:#b60005;font:0.18rem/2 "microsoft yahei";clear:both}
.imore:before{content:"";clear:both;}
.common_news{width:100%;height:auto;overflow:hidden;margin:2% auto;}
.news1,.news1 a,.news2,.news2 a{width:100%;height:auto;overflow:hidden;font:0.2rem/0.491rem "microsoft yahei";display:block;}
.news1,.news2{width:92.5%;margin:0 auto}
.news1 a span:nth-child(1){display:block;float:left;width:77%;height:0.491rem;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;color:#1d1d1d}
.news2 a span:nth-child(1){display:block;float:left;width:90%;height:0.491rem;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;color:#1d1d1d}
.news1 a span:nth-child(2),.news2 a span:nth-child(2){display:block;float:right;width:19%;height:0.491rem;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;text-align:right;color:#1d1d1d}
.news2 div{width:100%;font:0.18rem/0.3rem "microsoft yahei";color:#666;max-height:0.9rem;overflow:hidden;}
.news3{width:92.5%;margin:2% auto;height:auto;overflow:hidden;}
.news3>a{display:block;float:left;width:33%;height:1.2rem;overflow:hidden}
.news1>a>img{display:block;width:100%}
.news3>h1{display:block;float:left;width:64%;margin-left:3%;overflow:hidden}
.news3>h1>a{display:block;width:100%;height:auto;text-overflow: ellipsis;overflow:hidden;font:0.2rem/0.3rem "microsoft yahei";color:#1d1d1d;}
.news3>div{float:left;width:64%;margin-left:3%;overflow:hidden;font:0.18rem/0.2rem "microsoft yahei";max-height: 0.8rem;color:#1d1d1d;margin-top:2%}
.news4{width:50%;float:left;height:auto;overflow:hidden;margin:2% auto;}
.news4 a{display:block;width:80%;margin:0 auto;}
.news4 a img{display:block;width:100%; height:1.5rem;}
.news4 a span{display:block;width:100%;text-align:center;font:0.2rem/0.3rem "microsoft yahei";color:#666;text-overflow: ellipsis;overflow:hidden;white-space: nowrap;margin-top:6%}

/* for white */
.white-bg{background:#fff;}
@media all and (min-width:640px){
    .content{width:640px;margin:0 auto;position:relative;}
}
@media only screen and (max-width: 479px) and (min-width: 321px) {
    html{font-size: 70px;}
}
@media only screen and (max-width: 320px) {
    html{font-size: 60px;}
}