@charset "utf-8";

/* by Adon , CSS Document */



@font-face {

  font-family: Family;

  src: url("../fonts/sanfranciscodisplay-light-webfont.eot");

  src: local("☺"), url("../fonts/sanfranciscodisplay-light-webfont.woff") format("woff"), url("../fonts/sanfranciscodisplay-light-webfont.ttf") format("truetype"), url("../fonts/sanfranciscodisplay-light-webfont.svg") format("svg"); }



*{ 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:#2d2b3a; max-width:640px; margin:0 auto;}

a{ text-decoration:none; color:#2d2b3a;}

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;}

.en{font-family:Family, Tahoma, Geneva, sans-serif;}

.clearfix{clear:both}

.container{ padding-left:5%; padding-right:5%;}

.slider,.slider li a,.slider li{ float:left; width:100%;}

.slider li img{ display:block; margin:0 auto;}

.slider li{ position:relative; overflow:hidden;}

.slider li .box{ width:100%;margin:0 auto;color:#fff; left:0; right:0;position:absolute; top:40%;}

.slider li .box .item { color:#fff; text-transform:uppercase;}

.slider li .box .item .p1{ font-size:.22rem;}

.slider li .box .item .p2{ font-size:.45rem;;margin:5% 0;}

.slider li .box .item .p3{ font-size:.2rem;}

.slider li .box .item .p4{width:155px;height:42px; background:#009e9f; text-align:center; line-height:42px; margin-top:5%;}

.header{ float:left; width:100%; position:relative; top:0; z-index:10; padding:1% 0;}

.header .header-logo{width:130px; height:70px;}

.header .header-menu{width:70px; height:70px;}

.head2{ border-bottom:solid 1px #e2e2e2;}

.head1{ position:absolute;}

.head1 .header-logo{background:url(../img/logo.png) no-repeat center; background-size:contain}

.head1 .header-menu{background:url(../img/menu.png) no-repeat center; background-size:contain}

.head2 .header-logo{background:url(../img/logo.jpg) no-repeat center; background-size:contain}

.head2 .header-menu{background:url(../img/menu.jpg) no-repeat center; background-size:contain}

.iproducts li{float:left; width:100%; position:relative; margin-top:10px;}

.iproducts li img{ display:block}

.iproducts li .item{ position:absolute; font-size:.26rem;left:0; right:0; top:40%; width:100%;color:#fff}

.iproducts li .item .p1{ font-size:.48rem; text-transform:uppercase; text-align: center; margin-bottom:30%;}

.iproducts li .item .p2{margin:0 auto 35px auto; text-align:center;}

.iproducts li .item .p3{ width:155px; height:35px; line-height:35px; border:solid 2px #d1d1d1; text-align:center; margin:0 auto;}

.iproducts li .item .p3:hover{ background:#009e9f; color:#fff; border:solid 2px #009e9f}

.footer { float:left; width:100%; padding-bottom:25%; border-top:solid 1px #e6e6e6;}

.footer .footer-contact li{ float:left; font-size:.26rem;width:100%;;border-bottom:solid 1px #e6e6e6; padding-bottom:25%;}

.footer .footer-contact li font{ display:block; margin:10% 5%;}

.footer .footer-contact li span{ text-align:center;display:block;font-size:.65rem; text-transform:uppercase; margin:25% 0 20px 0;}

.footer .footer-contact li p{text-align:center; padding:0 5%;} 

.footer .addthis_toolbox{ margin:10% 0; text-align:center;}

.footer .addthis_toolbox a{ float:none !important; display:inline-block;*display:inline}

.footer .by{ font-size:.26rem; text-align:center;}

.footer .by a{ text-transform:uppercase;text-decoration:underline;color:#009e9f}

.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:#009e9f; 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;}

.about-banner{ width:100%; float:left;}

.about{overflow:hidden; clear:both;}

.about .p1{ font-size:.5rem; text-transform:uppercase;margin:15% 0;}

.about .p2{ font-size:.26rem; color:#808080;margin-bottom:15%; line-height:23px;}

.about .thumb{ position:relative; z-index:99;}

.culture{ font-size:.26rem;float:left; width:100%;background:url(../img/culture.jpg) no-repeat center; background-size:cover;color:#fff; padding:50% 0; margin-top:-30%;}

.culture .p1{line-height:23px;}

.culture .p2{ text-decoration:underline; margin-top:80px;}

.culture .p2 a{ color:#fff;}

.course{ float:left;width:100%; padding:15% 0;}

.course ul li{ float:left;width:100%}

.course ul li span{ display:block; font-size:.4rem;}

.course ul li p{ display:block; font-size:.24rem; line-height:24px;color:#808080;margin:10% 0;}

.contact{ float:left; width:100%;padding:10% 0 0 0;}

.contact .item .p1{ font-size:.3rem; color:#808080;}

.contact .item .p2{ font-size:.4rem; color:#2d2b3a; text-transform:uppercase;; margin:50px 0 25px 0;}

.contact .item .p3{ font-size:.3rem; color:#808080; line-height:23px;}

.contact .form{ border-top:solid 7px #dedede;border-bottom:solid 7px #dedede; margin:10% 0;}

.contact .form ul li{ float:left; width:100%; border-bottom:solid 1px #e2e2e2;}

.contact .form ul li .text{ font-size:.3rem; color:#2d2b3a; width:98%; padding:0 1%;border:0; line-height:80px;}

.contact .form .submit{ background:#009e9f; color:#fff; font-size:.32rem; width:155px; height:40px; line-height:40px; border:0; margin:20px 0;}

.news{ float:left; width:100%; margin:10% 0 20% 0;}

.news li{ float:left; width:80%; padding:10%; margin-left:-2px; margin-bottom:5%;border:solid 1px #e6e6e6;}

.news li em{ display:block}

.news li em.e1{ font-size:.22rem; text-transform:uppercase} 

.news li em.e2{ font-size:.9rem;;}

.news li span{ display:block;font-size:.4rem; margin:25% 0 10% 0;text-transform:uppercase;overflow:hidden;}

.news li p{ display:block;font-size:.24rem;color:#959595; line-height:24px;overflow:hidden;}

.news li:hover{ background:#009e9f; color:#fff;}

.news li:hover p,.news li:hover em,.news li:hover span{ color:#fff;}

.news-view{ float:left; width:100%; margin:10% 0 20% 0;}

.news-view .news-content{ border-top:solid 1px #e6e6e6; overflow:hidden;border-bottom:solid 1px #e6e6e6; font-size:.26rem; line-height:24px;color:#959595; padding:10% 0; margin:10% 0;}

.news-view .news-content img{ height:auto !important}

.news-view .next{ font-size:.28rem; text-align:center;}

.news-view .bak{ width:170px; text-transform:uppercase;height:45px; line-height:45px;text-align:center; margin:10% auto; background:#009e9f; color:#fff; font-size:.24rem;}

.news-view .bak a{ color:#fff;}

.news-view .news-title{ font-size:.5rem;margin:5% 0 15% 0; text-align:center; font-weight:normal}

.news-view .news-time{font-size:.24rem; text-transform:uppercase; text-align:center; display:block}

.news-view .news-time font{ display:block; font-size:.9rem;;}

.products-banner{ padding:25% 0;float:left; width:100%;}

.products{ float:left; width:100%;}

.products .products-item{ margin:15% 0;}

.products .products-item .p1{ font-size:.65rem;;text-transform: uppercase}

.products .products-item .p2{ font-size:.35rem; margin:10% 0; text-transform:uppercase;}

.products .products-item .p3{ font-size:.24rem; color:#808080;}

.products .products-menu{ border-top:solid 1px #e2e2e2; padding:7.5% 7.5% 0 7.5%; text-align:center;position:relative}

.products .products-menu span{ display:block;border:solid 1px #e2e2e2;width:100%;line-height:48px; color:#808080;; text-align:center;font-size:.3rem;overflow:hidden;text-overflow: ellipsis;white-space: nowrap; text-transform:uppercase; background:url(../img/down.png) no-repeat 95%;}

.products .products-menu ul{ position:absolute; top:77px; left:0; width:85%; display:none;background:#009e9f; margin:0 7.5%; z-index:99}

.products .products-menu li{border-bottom:solid 1px #fff; width:100%;line-height:48px; font-size:.24rem; color:#fff; float:left; overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}

.products .products-menu li a{color:#fff;}

.products .products-list { float:left; width:100%;margin:10% 0;}

.products .products-list li{ float:left; width:49%; margin-bottom:10%;}

.products .products-list li.l{ margin-right:1%;}

.products .products-list li.r{ margin-left:1%;}

.products .products-list li .thumb{ display:block;border:solid 1px #d2d2d2;width:100%; text-align:center; overflow:hidden;}

.products .products-list li .thumb img{ margin:15% auto; max-height:150px;}

.products .products-list li span{ display:block; font-size:.26rem;; margin:15px 10px; overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}

.products .products-list li font{ display:block; font-size:13px; margin:0 10px;}

.products .p{ font-size:.3rem;; margin:10% 0 0 0;}

.products .products-view { text-align:center;}

.products .products-view .p1{ font-size:.6rem;}

.products .products-view .p2{ font-size:.36rem;margin:5% 0 10% 0;}

.products .products-view .p3 font{ float:left; width:100%;}

.products .products-view .p3 font span{ display:block; font-size:.33rem; margin:10% 0 5% 0;color:#2d2b3a;}

.products .products-view .p3{ border-top:solid 1px #e2e2e2; border-bottom:solid 1px #e2e2e2; text-align:center;padding-bottom:35px; overflow:hidden; font-size:.26rem; color:#808080; line-height:24px;}

.products .products-pic{ position:relative;float:left; margin:70px 0;width:100%; height:780px;}

.products .products-pic li{ text-align:center; height:780px; overflow:hidden;}

.products .products-pic .prev{ position:absolute; top:340px; left:-100px; z-index:10}

.products .products-pic .next{ position:absolute; top:340px; right:-100px; z-index:10}

.products-slider{ margin:15% 0;}

.products-slider,.products-slider li a,.products-slider li{ float:left; width:100%;}

.products-slider li img{ display:block; margin:0 auto;}

.products-slider li{ position:relative; overflow:hidden;}

.map{ float:left; width:100%; height:400px; margin-bottom:20%;}

.map img{ max-width:inherit}









@media (max-width:480px){

.slider li img{ max-width:110%; width:110%; margin-left:-5%;}

}

@media (max-width:320px){

.header .header-logo{width:120px; height:55px;}

.header .header-menu{width:55px; height:55px;}

.news li{ padding:7.5%; width:85%;}

.about .p2,.culture .p1,.course ul li p,.contact .item .p3,.news li p,.news-view .news-content,.products .products-view .p3{ line-height:20px;}

}