@charset "utf-8";
/* by Adon , CSS Document */

@font-face
{
font-family: Family;
src: url('../fonts/Lato-Regular.otf');
src: url('../fonts/Lato-Regular.ttf');
src: url('../fonts/Lato-Regular.woff');
} 

*{ margin:0; padding:0;}
body{ font-size:12px; font-family:Family, Tahoma, Geneva, sans-serif;color:#40404c; max-width:640px; margin:0 auto;}
a{ text-decoration:none; color:#40404c;}
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%;}


.header{position:relative; float:left;width:90%; padding:5% 0;text-align:center;margin-left:5%; margin-right:5%;border-bottom:solid 1px #e1e1e1}
.header .logo{ text-align:center;}
.header .logo img{ height:78px;}
.header .menu{position:absolute;right:0;top:50%; margin-top:-10px;}
.header .menu img{ height:25px;}
.header-fix{background:url(../img/bg.png) repeat; width:100%; line-height:34px;position:fixed; top:0; left:0; height:100%; z-index:999; display:none;}
.header-fix .close{ position:absolute; right:0; top:0; z-index:9}
.header-fix .header-ul{ padding-left:15%;padding-top:15%;text-transform:uppercase;position:fixed; top:0; right:-100%; background:#015196; height:100%; width:65%; font-size:.28rem; color:#fff; overflow:hidden;}
.header-fix .header-ul ul li { float:left; width:100%;}
.header-fix .header-ul ul li a{ float:left; width:100%; height:100%; color:#fff;}
.header-fix .header-ul ul li.t{ font-size:.33rem}
.header-fix .close{ width:50px;}
.index-content{ float:left; width:100%; text-align:center;}
.index-content .p1{ font-size:.33rem; margin:20% 15px;}
.index-content .p2{ margin-bottom:20%;}
.index-content ul li{ float:left; width:100%; position:relative; margin-bottom:2.5%}
.index-content ul li .item{ position:absolute; background:#015196; left:0; right:0; top:25%; color:#fff; max-width:220px; margin:0 auto; padding:15% 0;font-size:.4rem;}
.index-content ul li .item font{ display:block; font-size:.28rem; margin-top:5%;}
.index-content ul li img{ display:block;}
.index-content .p3{color: #979797; font-size: 13px; text-align: center; margin:10% 0 5% 0;}
.index-content .p4{ max-width: 240px; margin: 0 auto; height: 55px; line-height:55px;border: 1px solid #cbcbcb; font-size:.28rem;}
.footer{position:relative; float:left;width:90%; margin:15% 5% 30% 5%; color:#979797;text-align:center; font-size:.25rem; line-height:20px;}
.footer a{color:#979797;}
.footer .p1{ border-top:solid 1px #e1e1e1; border-bottom:solid 1px #e1e1e1; padding:10% 0; margin:10% 0;}
.footer .p2 a{ text-decoration:underline; color:#015196}
.about{ float:left; width:100%; text-align:center;}
.about .p1{ font-size:.35rem; margin:20% 0;}
.about .p2{ font-size:.26rem; color:#8e8e8e; line-height:20px;}
.about .p3{ margin:15% 0;}
.contact{ background:url(../img/about-contact_07.jpg) no-repeat center;background-size: cover;color:#fff; text-align:center;float:left; width:100%;font-size:.26rem;line-height:20px; padding:50% 0; margin-top:20%;}
.contact .p1{ font-size:.35rem; margin-bottom:10%;}
.contact a{ color:#fff;}
.products,.products-list{ float:left; width:100%;}
.products li{ float:left; width:50%; position:relative; margin-top:10%;}
.products li .item{ padding:10% 5%;}
.products li .item .p1{ font-size:.3rem;}
.products li .item .p2{color:#8e8e8e; margin:10% 0 15% 0;}
.products li .item .p3{color:#40404c; text-decoration:underline;}
.products li,.products-list li{ width:100%;}
.products-list{ margin-top:10%;}
.products-list li{ float:left; position:relative;position:relative; overflow:hidden;}
.products-list li img{ display:block}
.products-list li .item{ background:#015196; display:none;top:0; left:0; text-transform:uppercase;line-height:25px;padding:10%;position:absolute; width:80%; height:80%; color:#fff; font-size:.3rem;}
.products-list li:hover .item{ display:block;}
.products-list li.t{ border:solid 1px #c8c8c8; margin-left:-2px; height:100%; padding:15% 5%; width:90%;}
.products-list li.t .p1{font-size:.3rem;}
.products-list li.t .p2{color:#8e8e8e; margin-top:15%}
.products-view { text-align:center;}
.products-view .thumb{ float:left; width:100%; background:url(../img/products-list-views_03.jpg) no-repeat center;background-size: cover;text-align:center;color:#fff; font-size:.4rem; text-transform:uppercase; padding:25% 0; margin:5% 0 20% 0;}
.products-view .thumb a{ color:#fff;}
.products-view .p1{ font-size:.33rem; text-transform:uppercase}
.products-view .p2{ font-size:13px; color:#8e8e8e; line-height:19px; margin:5% 0 20% 0;}
.products-view .products-thumb{ border-top:solid 1px #e1e1e1; padding-top:10%; margin-top:10%;}
.products-view .products-thumb a{ float:left; width:48%; margin-right:4%; margin-bottom:5%;}
.products-view .products-thumb a.clear{ margin-right:0;}
.products-view .products-thumb a font{ display:block; font-size:.3rem; margin:5% 0 10% 0;}


@media (max-width:320px){
.header .logo img{ height:60px;}
.header .menu img{ height:18px;}
}