﻿@charset "utf-8";
a{ color:#333; text-decoration:none;}
a:hover{ color:#FF9048;}
img{ border:0px;}
ul,li,h1,p,h2{ margin:0px; padding:0px; list-style:none; font-weight:normal}
input{font-family:"Microsoft Yahei";}
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	color:#666;
	text-align:center;
	font-family:"Microsoft Yahei";
	font-size:16px
	-webkit-font-smoothing: antialiased; 
	-moz-osx-font-smoothing: inherit | grayscale
}
.fl{ float:left;}
.fr{ float:right;}
/*top*/
.m_top,.g-ft,.banners{ display:none;}
.top{ width:100%; float:left; line-height:37px;font-size:12px; background:#F4F4F4; border-bottom:1px solid #E5E5E5;}
.container{width:100%; max-width:1260px;height:auto; margin:0 auto; text-align:left;}
.top a{ padding-left:12px; padding-right:12px;}
.topbar_r_wx{ float:right; position:relative;z-index:2000;padding-left:12px;}
.topbar_r_wx div{ position:absolute; z-index:20; display:none; }
.topbar_r_wx:hover{ cursor:pointer; color:#D71317}
.topbar_r_wx:hover div{ display:block; top:32px; right:-20px; z-index:2000}

.head{ width:100%; float:left; padding-top:25px;padding-bottom:30px;}
.head .tel{ padding-top:12px;}

.navs{ width:100%; height:55px;float:left; background:#1A97D0;}
.navs .container ul{ width:100%; height:auto; float:left; line-height:55px; font-size:1.428em;}
.navs>.container>ul>li{position:relative;float:left;}
.navs>.container>ul>li,.navs>.container>ul>li>a{display:inline-block;text-align:center}
.navs>.container>ul>li>a{padding:0 22px; color:#fff; margin-right:9px; margin-left:9px;}
.navs>.container>ul>li.current>a,.navs>.container>ul>li>a:hover{ background:url(../images/onmenubg.jpg) top center;text-decoration:none;-webkit-transition:background-color .3s ease 0s;-moz-transition:background-color .3s ease 0s;-o-transition:background-color .3s ease 0s;-ms-transition:background-color .3s ease 0s;transition:background-color .3s ease 0s}
.navs>.container>ul>li,.navs>.container>ul>li>a{line-height:55px;font-size:18px}

/*banner*/
.banner{ width:100%; height:500px;float:left; text-align:center;}
.fullSlide {width:100%;position:relative;height:500px;z-index:5;}
.fullSlide .bd {margin:0 auto;position:relative;overflow:hidden;}
.fullSlide .bd ul {width:100% !important; list-style:none; margin:0px;}
.fullSlide .bd li {width:100% !important;	height:500px;overflow:hidden;text-align:center;}
.fullSlide .bd li a {display:block;height:500px;}
.fullSlide .hd {width:100%;position:absolute;bottom:0;left:0;height:30px;line-height:30px;}
.fullSlide .hd ul {text-align:center;}
.fullSlide .hd ul li {cursor:pointer;display:inline-block;*display:inline;zoom:1;width:55px;height:10px;margin:1px;overflow:hidden;background:#000;line-height:999px;}
.fullSlide .hd ul .on {background:#FF9048;}

.search{ width:100%; float:left; height:60px; background:#EFEFEF; border-top:1px solid #fff;}
.keys{ float:left; line-height:60px; font-size:14px;}
.keys a{ color:#666666;}
.sear{ float:right; padding-top:16px;}
.sear .s{ width:298px; height:28px; background:#fff;border-radius:25px; padding-left:16px;
-moz-border-radius:25px; /* Old Firefox */}
.input{ float:left;}
.input input{ width:250px;border:none; line-height:26px;}
.btn{ float:left; padding-top:5px;}

/*about*/
.about{ width:100%; float:left; padding-top:75px; padding-bottom:80px;}
.a_img{ width:35%; float:left;}
.a_img img{ max-width:100%;}
.a_con{ width:65%; float:left;}
.a_tit{ width:100%; float:left; padding-bottom:30px;}
.a_tit h1{ font-size:40px; color:#FF9048; font-weight:bold;}
.a_tit h1 span{ color:#CCCCCC; font-size:35px; font-weight:100; font-family:Arial, Helvetica, sans-serif;}
.a_tit p a{ background:#FF9048; line-height:36px; color:#fff;padding:5px 28px;}
.a_txt{ width:100%; float:left; line-height:200%;}

/*product*/
.product{ width:100%; float:left; background:#efefef; padding-top:60px; padding-bottom:60px;}
.pro_class{ width:24%; float:left; padding-right:1%;}
.pro_con{ width:75%; float:left;}
.class1{ width:100%; float:left; font-size:18px; margin-bottom:1px;}
.class1 a{ width:82%; float:left;background:#1A97D1; line-height:60px; color:#fff; padding-left:18%;}
.class2{ width:100%; float:left; font-size:18px; margin-bottom:1px;}
.class2 a{ width:82%; float:left;background:url(../images/classbg.jpg); line-height:60px;padding-left:18%; margin-top:1px; margin-bottom:1px;}
.class2 a:hover{ background:url(../images/on_classbg.jpg); color:#FF9048}
.class1 a.on{ width:82%; float:left;background:url(../images/blue_bg.jpg);line-height:60px; color:#fff; padding-left:18%;}

.pro{ width:32.8333%; float:left; background:#fff; margin-right:0.5%; height:357px; margin-bottom:3px; text-align:center;}
.pro img{ padding:8%; width:84%; padding-bottom:3%; padding-top:3%; height:250px; padding-bottom:15px;}
.pro .zx{ width:100%; float:left;margin-top:25px;}
.pro .zx span{ padding:8px 15px; background:#FF9048; font-size:12px; color:#fff; margin-left:5px; margin-right:5px;}
.pro .zx span:hover{ background:#1A97D1;text-decoration:none}

.cont { 
    display: block; 
    position: fixed; 
    top: 25%; 
    left: 25%; 
    width: 40%; 
    height: 50%; 
    padding: 20px; 
    border: 10px solid #ddd; 
    background-color:#fff; 
    z-index:1; 
    overflow: auto; 
}
.cont .close{ text-align:right; padding-bottom:10px;}
.cont .close a{ text-decoration:underline; color:#ff0000}
.cont .message{ width:80%; padding-left:10%; padding-right:10%; padding-top:15px;}
.message{width:80%; float:left; padding-left:9.5%; padding-right:9.5%; border:1px solid #f1f1f1; padding-top:15px; padding-bottom:15px; font-size:14px;}
.f-tit{ width:20%; float:left; line-height:30px; margin-bottom:5px;}
.f-input{width:80%; float:left; margin-bottom:5px;}
.f-sub{ width:100%; float:left; padding-top:20px;}
.f-input .input{ width:97%; border:1px solid #eee; background:#f9f9f9; height:30px; padding-left:3%; line-height:30px;}
.f-input .inputs{ width:99%; border:1px solid #eee; background:#f9f9f9; line-height:30px; height:60px}
.f-sub input{ width:200px; height:50px; background:#999999; text-align:center; line-height:50px; color:#fff; border:none; font-family:"微软雅黑"; cursor:pointer}

.youshi{ width:100%; float:left; padding-top:65px; padding-bottom:60px;}
.title{ width:100%; float:left; text-align:center; font-size:40px; font-weight:bold; color:#333333;}
.title span{ color:#FF9048; font-size:50px; font-family:"Century Gothic"}
.ps{ width:100%; float:left; text-align:center; padding-top:15px;}
.ps img{ padding-left:30px; padding-right:30px; padding-bottom:5px;}

.hb{ width:100%; float:left; text-align:center; padding-top:60px;}
.ys_con{ width:93%; float:left; padding-top:60px; padding-bottom:60px; padding-left:7%;}
.ys_con div{ width:205px; height:191px; float:left; background:url(../images/ysbg_on.jpg); text-align:center; padding-top:50px; margin-left:6px; margin-right:6px;}
.ys_con div h1{ font-size:20px; color:#1A97D1; font-weight:bold; padding-bottom:10px;}
.ys_con div p{ font-size:14px; line-height:150%;}
.ys_con div:hover{ background:url(../images/ysbg.jpg);}
.ys_con div:hover h1,.ys_con div:hover p{ color:#fff;}

.case{ width:100%; float:left; background:url(../images/anli_bg.jpg); background-repeat:no-repeat; padding-top:55px; padding-bottom:55px; color:#fff;}
.case .title{ color:#fff;}
.case_con{ width:100%; float:left; margin-top:45px; font-size:20px;}
.case_con a{ color:#fff;}
.case_con a:hover{ color:#FF9048}
.case_con .c1{ width:20%; float:left; text-align:center; border:1px solid #fff; border-right:none; line-height:100px;}
.case_con .c2{ width:19%; float:left; text-align:center; border:1px solid #fff;line-height:100px;}
.case_con .c3{ width:20%; float:left; text-align:center; border:1px solid #fff; border-right:none; border-top:none;line-height:100px;}
.case_con .c4{ width:19%; float:left; text-align:center; border:1px solid #fff; border-top:none;line-height:100px;}

/*news*/
.news{ width:100%; float:left;padding-top:76px;}
.n_tit{ width:100%; float:left; text-align:center;}
.n_tit h1{ padding-bottom:10px;font-size:35px;}
.n_tit span{ font-size:40px; color:#676767; }
.n_con{ width:100%; float:left; padding-top:40px;}
.n_con .n_list{ width:47%; float:left; padding-right:3%; padding-bottom:35px;}
.n_con .n_list .n_date{ width:65px; height:70px; float:left; background:#1A97D1; color:#fff; text-align:center; margin-right:20px; font-size:14px; padding-top:5px; padding-left:3px; padding-right:3px;}
.n_con .n_list .n_tits{ color:#666;}
.n_con .n_list .n_tits h1{ color:#333; padding-bottom:5px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical }
.n_con .n_list .n_tits p{ line-height:150%;}

.imgZoom img,.imgY180 img { -moz-transition:all .8s ease 0s; -ms-transition:all .8s ease 0s; -o-transition:all .8s ease 0s; -webkit-transition:all .8s ease 0s; transition:all .8s ease 0s;}
.imgZoom { overflow:hidden; -webkit-transform:rotate(0); transform:rotate(0); }
.imgZoom:hover img{ -moz-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); -o-transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); transform:scale(1.1,1.1);}
.imgY180:hover img { cursor:pointer; -moz-transform:rotateY(180deg); -ms-transform:rotateY(180deg); -o-transform:rotateY(180deg); -webkit-transform:rotateY(180deg); transform:rotateY(180deg) }

.pagefoot{ width:100%; float:left; background:#3B3F4A; padding-top:30px; padding-bottom:40px;color:#C5C6C9;}
.p_logo{ float:left; border-right:1px solid #272A34; padding-right:81px; height:155px; padding-top:33px;}
.p_weixin{ float:left; border-left:1px solid #4E5362; border-right:1px solid #272A34;padding-left:72px; padding-right:72px; padding-top:20px; height:168px; text-align:center;  font-size:14px;}
.p_add{float:left; border-left:1px solid #4E5362;padding-left:72px;padding-top:15px; height:173px;}
.p_add h1{ padding-bottom:13px; font-weight:bold; font-size:16px;}
.p_add p{ font-size:14px; line-height:200%;}
.pagebot{ width:100%; float:left; background:#2C2F38; line-height:50px; color:#C5C6C9; font-size:14px;}
.pagebot a{color:#C5C6C9;}

.fnt18{ font-size:18px;}
.fnt30{ font-size:30px;}
.color_666{ color:#666;}
.orange{ color:#ff0000}
@media(max-width:480px){
body{ font-size:14px;}
.top,.head,.navs,.banner,.search,.cp_show,.pagefoot,.pro_con,.class2{ display:none;}
.m_top,.mb_show,.banners{ display:block;}


.m_top{width:100%; height:auto;float:left; padding-top:10px; padding-bottom:20px; position:fixed; z-index:1000; background:#fff;box-shadow: 1px 1px 3px  0 #153F57 }
.m_top_l{ float:left; padding-left:5px;}
.m_top_l img{ max-width:170px;}
.m_top_r{ float:right;padding-left:10px;}
#navbar {
  max-width: 1000px;
  margin: 0 auto;
  padding-top:22px;
  padding-right:10px;
}

.menubtn {
 
  position: relative; 
  z-index: 101;
  color: #274a61;
  text-decoration: none;
  font-size: 0em;
  line-height: 0em;
  top: 2px;
  padding: 20px 10px;
  background-image: url('../img/hamburger.png');
  background-position: 50% 50%;
  background-size: 40px 20px;
  background-repeat: no-repeat;
}
.menubtn:hover, .openmenu .menubtn {
  color: #bdd43e;
  background-image: url('../img/hamburger-active.png');
}

/** toggle menu **/
body.openmenu {
  position: fixed;
  overflow: hidden;
}

.overlay {
  position: fixed;
  z-index: 99;
  background-color: rgba(0,0,0,0.5);
  bottom: 0;
  right: 0;
  left: 0;
}

.openmenu .overlay {
  top: 0;
}

#hamburgermenu {
  height: 100%;
  width: 0;
  background: #333333;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 101;
  overflow: hidden;
  -webkit-box-shadow: 3px 0 7px rgba(0,0,0,0.55);
  -moz-box-shadow: 3px 0 7px rgba(0,0,0,0.55);
  box-shadow: 3px 0 7px rgba(0,0,0,0.55);
}
#hamburgermenu ul {
  margin-top: 45px;
  z-index: 101;
  overflow-y: auto;
  overflow-x: hidden;
}
#hamburgermenu ul li {
  display: block;
  width:80%; float:left;
  padding-left:5%; padding-right:5%;
}
#hamburgermenu ul li a {
  display: block;
  text-decoration: none;
  line-height:40px;
  color:#adadad;
  margin-bottom:5px;
  border-bottom:1px solid #2b2b2b;
  text-align:left;
  padding-left:10%;
  font-weight:bold;
}
#hamburgermenu li a:hover {
  color: #fff;
  background: #2b2b2b;
}

.banners{ width:100%; height:auto; float:left;padding-top:75px;}
.banners img{ width:100%;}
.vr_banner_pages {
    line-height: 20px;
}

.vr_banner_pages .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    opacity: 1;
    border-radius: 10px;
    vertical-align: middle;
    cursor: pointer;
}

.vr_banner_pages .swiper-pagination-bullet-active {
    width: 10px;
    height: 10px;
    margin-top: -12px;
	background:#00479D;
}

.container,.title,.car_show{ width:96%; padding-left:2%; padding-right:2%;}
.about{  padding-bottom:30px; padding-top:20px;}
.container{ width:96%; padding-left:2%; padding-right:2%;}

.a_img,.a_con{ width:100%;}
.a_tit{ width:100%; float:left; padding-bottom:20px; padding-top:15px;}
.a_tit h1{ font-size:20px;}
.a_tit h1 span{ font-size:18px;}
.a_tit p a{padding:5px 18px;}
.a_txt{ line-height:180%;}

.title{ font-size:20px;}
.title span{font-size:22px;}

.ys_con{ padding-top:20px; padding-bottom:20px; padding-left:0%;}
.ys_con div{ width:48%; height:120px; background:#EFEFEF;padding-top:10px; margin-left:1%; margin-right:1%; margin-bottom:10px; padding-bottom:10px;}
.ys_con div h1{ font-size:16px;}
.ys_con div:hover{ background:#1A97D1;}

.hb{padding-top:15px;}
.hb img{ max-width:100%;}

.case{ padding-top:25px; padding-bottom:25px;}
.case_con{ margin-top:25px; font-size:13px;}
.case_con .c1{ width:19%;line-height:50px;}
.case_con .c2{line-height:50px;}
.case_con .c3{ width:19%;line-height:50px;}
.case_con .c4{ width:19%;line-height:50px;}

.news{ width:100%; float:left;padding-top:26px;}
.n_con .n_list{ width:100%; float:left; padding-right:0%; padding-bottom:15px;}
.n_con .n_list .n_date{ height:60px;padding-top:15px;}
.pro_class{ width:100%; float:left; padding-right:0%;}

.product{padding-top:15px; padding-bottom:15px;}
.class1{ width:46%; float:left; font-size:16px; margin-bottom:1px; margin:1% 2%}
.class1 a{ line-height:50px;}
.class1 a.on{background:#1A97D1;line-height:50px;}

.pagebot{ line-height:30px; padding-top:5px;}

.fnt20{ font-size:16px;}
.fnt18{ font-size:16px;}
.fnt30{ font-size:20px;}
}