@charset "utf-8";
/* by Adon , CSS Document */

@font-face{font-family:Family;src:url("../fonts/AvenirNextLTPro-Regular.otf");src:url("../fonts/AvenirNextLTPro-Regular.ttf");src:url("../fonts/AvenirNextLTPro-Regular.ttf")}

*{ margin:0; padding:0;}
body{ font-size:12px;font-family:"Source Han Sans SC", "HanHei SC", "PingFang SC", "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", 黑体, Arial, sans-serif;color:#383838;max-width:640px; margin:0 auto;}
a{ text-decoration:none; color:#383838;}
ul,li{list-style:none}
img{ border:0; max-width:100%;}
h1,h2,h3{ font-size:12px;}
em{font-style:normal}
p{display:block;}
.left{ float:left;}
.right{ float:right;}
.clearfix{clear:both}
.container{ padding-left:5%; padding-right:5%;}
.en{font-family:Family, Tahoma, Geneva, sans-serif;}
.header{width:100%; z-index:10;position:relative; left:0; top:0;}
.header .logo{ width:170px; height:65px;}
.header .menu{ width:65px; height:65px;background:url(../img/menu.png) no-repeat center;background-size:cover;}
.head2{background:#fff; float:left;}
.head1{position:absolute;}
.head1 .logo{background:url(../img/logo.png) no-repeat center;background-size:cover;}
.head2 .logo{background:url(../img/logo.jpg) no-repeat center;background-size:cover;}
.slider{ text-align:center; position:relative; float:left; width:100%; overflow:hidden; position:relative; margin-bottom:12.5%;}
.slider .slider-p{ position:absolute; font-size:13px;bottom:5%; left:0; right:0; color:#fff; line-height:20px;text-transform:uppercase;}
.slider .slider-p .p2{ margin:10% 0;}
.slider img{ display:block;}
.slider li{ width:100%; overflow:hidden; position:relative;}
.slider li .box { position:absolute; top:50%; margin-top:-85px;left:0; right:0; width:100%; color:#fff; text-align:right;}
.slider li .box .p1{ font-size:.57rem;}
.slider li .box .p2{ font-size:.26rem; margin-top:10px;}
.screening li{ float:left; height:50%;width:50%; position:relative;}
.screening li.l{ height:100%;}
.screening li img{ display:block;}
.screening li .item{ color:#fff; position:absolute; top:50%;left:0; right:0; margin:-25px auto; text-align:center;}
.screening li .item .p1{ font-size:.36rem;}
.screening li .item .p2{ font-size:.3rem; margin-top:10px;}
.iabout{ position:relative; width:90%; margin:0 auto;font-size:.32rem; color:#fff; text-transform:uppercase; text-align:center; padding:35% 0;background:url(../img/ibrand.jpg) no-repeat center; background-size:cover; margin-top:5%;}
.footer{ float:left; width:100%; font-size:14px; margin:15% 0 15% 0; padding-top:5%; color:#4d4d4d;text-align:center; border-top:solid 1px #f6f6f6;}
.footer .p1{ text-transform:uppercase;}
.footer .p3{ font-size:15px;}
.footer .p4{ margin:5% 0;}
.footer .p4 a{ text-decoration:underline; color:#d58884;}
.footer .p5{ margin:10% 0;}
.header-fix{ position:fixed; top:0; left:0; width:100%; height:100%; display:none;background:#fff; z-index:99}
.header-fix .p1{ text-align:center; margin-bottom:5%;}
.header-fix ul{ width:80%; margin:0 auto}
.header-fix ul li{ display:block;font-size:.36rem;margin-bottom:5%;}
.header-fix ul li.click .down { display:none;margin-top:5%;}
.header-fix ul li.click .down li{ font-size:.3rem;}
.header-fix ul li.click img{ position:absolute; top:5px; right:0;}
.header-fix ul li.click { position:relative;}
.header-fix .close{ position:absolute; top:4%; right:5%;}
.header-fix .close img{ height:20px;}
.about{ text-align:center;color:#7e7e7e; overflow:hidden; margin:25% 0;}
.about .p1 img{ width:80%;}
.about .p2{ font-size:13px;margin:15px 0;}
.about .p3{ margin:15% 0;}
.about .p3 img{ width:70px;}
.about .p4{ font-size:.3rem; line-height:24px;}
.contact{ float:left; width:100%; height:100%; color:#fff; margin-bottom:5%;padding:60% 0;background:url(../img/contact.jpg) no-repeat center; background-size:cover}
.contact p{ padding:0 10%;}
.contact .p1{ font-size:.37rem; text-transform:uppercase;}
.contact .p2{ font-size:.3rem;}
.contact .p3{ font-size:.38rem;}
.contact .p4{ font-size:.24rem;}
.news { float:left; width:100%; margin:10% 0 0 0;}
.news li{ float:left; margin-bottom:15%;}
.news li img{ border:solid 5px #d58884;}
.news li:hover span{color:#d58884;}
.news li:hover p{ text-decoration:underline}
.news li span{ display:block; font-size:.34rem; margin-top:5%;}
.news li p{ display:block; font-size:13px; color:#7e7e7e; margin:5% 0;line-height:22px;}
.news li em{ display:block; font-size:14px; color:#d58884; text-transform:uppercase}
.news-view{ float:left; width:100%; margin:10% 0;}
.news-view .news-title{ display:block; font-size:.45rem; color:#383838; text-align:center;}
.news-view .news-time{ display:block; font-size:14px; color:#d58884; text-align:left;text-transform:uppercase; margin:5% 0 25% 0;}
.news-view .news-content{font-size:.26rem;color:#7e7e7e;line-height:23px;}
.news-view .news-content img{ width:100% !important; height:100% !important;}
.products li{ float:left; width:100%;}
.products li .bg{ float:left; width:100%; padding:55% 0;color:#fff; text-align:center; position:relative; }
.products li .bg .item .p1{ font-size:.37rem;}
.products li .bg .item .p2{ font-size:.7rem; margin:2.5% 0 10% 0;}
.products li .bg .item .p3{font-size:13px;width:170px;height:45px;line-height:45px;text-align:left;text-indent:35px;margin:0 auto;background:url(../img/products.png) no-repeat center;background-size:contain;}
.products li .bg .item .p3:hover{background:url(../img/productss.png) no-repeat center;background-size:contain;}
.products li .p{ padding:15% 5%;clear:both;text-align:center; font-size:.24rem;line-height:22px;}
.products-list .lists li{ float:left; width:49%; margin-bottom:2%;}
.products-list .lists li.r{margin-left:1%;}
.products-list .lists li.l{ margin-right:1%;}
.products-list .lists li img{ display:block;}
.products-list .lists li span{ font-size:14px; color:#fff; display:block; background:#d58884; padding:10%; line-height:23px;}
.products-list .products-menu{ margin:10% 0; float:left; width:100%;}
.products-list .menu{ float:left; border:solid 1px #dcdcdc; position:relative;text-align:center; width:31.33%; margin:0 0.5%;}
.products-list .menu:hover font{ background:#d58884; color:#fff;}
.products-list .menu font{ display:block; cursor:pointer;line-height:35px;font-size:13px; color:#8d8d8d; }
.products-list .menu ul{ background:#d58884; color:#fff; width:100%;position:absolute; top:40px; z-index:9; left:0; padding:10px 0 20px 0; display:none}
.products-list .menu ul li{ display:block; font-size:px; border-bottom:solid 1px #dda09d; margin:0 10px; line-height:40px;}
.products-list .menu ul li a{ color:#fff;}
.products-view { float:left; width:100%; margin:20% 0 10% 0;}
.products-view .p1{ font-size:.35rem;text-align:center; line-height:33px;}
.products-view .p2{font-size:.35rem; text-transform:uppercase}
.products-view .p3{font-size:.4rem;}
.products-view .p4{font-size:14px; color:#8d8d8d;margin:25% auto; line-height:24px; text-align:center;}
.products-view .app{ overflow:hidden; margin-top:20%;}
.products-view .app li{ float:left; width:49%; text-align:center;border-right:solid 1px #d2d2d2; padding:10% 0;}
.products-view .app li.clear{ border-right:none;}
.products-view .app li span{ display:block; text-align:center; font-size:.3rem; color:#8d8d8d; margin-top:20%;}
.products-view .app li img{ height:50px;}
.products-view .pro { overflow:hidden; margin:20% 0;}
.products-view .pro li{width:49%;float:left; margin-bottom:2%;margin-right:2%;}
.products-view .pro li img{ display:block;}
.products-view .pro li.r{ margin-right:0;}
.products-pro{ display:none}
.products-view .size{ overflow:hidden;}
.products-view .size .p{ border-bottom:solid 1px #f6f6f6; font-size:.3rem; padding-bottom:5%; margin-bottom:5%;}
.products-view .size ul li{ float:left; margin-right:4%; width:48%;margin-bottom:10%;}
.products-view .size ul li.clear{ margin-right:0;}
.products-view .size ul li span{ display:block; text-align:center; font-size:.3rem; margin:5% 0;}

@media (max-width:414px){
.slider img{ max-width:110%; width:110%; margin-left:-5%;}
}

@media (max-width:320px){
.header .logo{ width:150px; height:50px;}
.header .menu{ width:50px; height:50px;}
}















