@charset "gb2312";
/* CSS Document */

.flex1 { -webkit-box-flex: 1; -moz-box-flex: 1;	-webkit-flex: 1; -ms-flex: 1;flex: 1;}
.flex{ display: box;	 display: -webkit-box;	 display: -moz-box;display: -ms-flexbox;display: -webkit-flex; display: flex;}
.flex-hc { -webkit-box-pack: center;-webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center;-o-justify-content: center;justify-content: center;display: box;	 display: -webkit-box;	 display: -moz-box;display: -ms-flexbox;display: -webkit-flex; display: flex;}
.flex-hs { -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between;-ms-justify-content: space-between; -o-justify-content: space-between;justify-content: space-between;}
.flex-vc {-webkit-box-align: center;-webkit-align-items: center;-moz-align-items: center; -ms-align-items: center;-o-align-items: center; align-items: center;}
.flex-v {display: box;display: -webkit-box;  display: -moz-box;	display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-orient: vertical;
-webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; -o-flex-direction: column;flex-direction: column;}
.flex-hw {-webkit-box-lines: multiple;-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap;}

html, body { height: 100%;}
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0 }
ul, ol { list-style: none }
.cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.cl { zoom: 1; }
a { text-decoration: none; }
h2, h3, h4 { font-family: "Microsoft YaHei"; }
html{ font-size:125%;}
body {  font-size:28px; font:1.4em/1.4 "microsoft yahei", "Tahoma", \5b8b\4f53, Arial;color: #444; font-family:"microsoft yahei"; }
.wp { width: 100%; min-width: 320px; max-width: 640px; margin: 0 auto; overflow:hidden;}
.z{ float:left;}
.y{ float:right;}
.tr{ text-align:right;}
.tc{ text-align:center;}
img{ border:none; border:0;}
img{ width:100%; height:auto;}
.lay { padding-left:2% !important; padding-right:2% !important; }

.head{ width:100%; background: -webkit-linear-gradient(#ececec, #ffffff); background: -o-linear-gradient(#ececec, #ffffff);  background: -moz-linear-gradient(#ececec, #ffffff); background: linear-gradient(#ececec, #ffffff);box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);}
.head .top{ height:3.4rem; overflow:hidden; padding:0.8rem 0;}
.head .logo{ width:54.6%; height:auto; overflow:hidden;}
.head .h_r a{ color:#fff;}
.head .h_r span{ padding:0.3rem 0.4rem; line-height:1.4rem; color:#ffffff; font-size:1.3rem; text-align:center; border-radius:0.5rem;-moz-border-radius:0.5rem;-ms-border-radius:0.5rem;-o-border-radius:0.5rem;-webkit-border-radius:0.5rem;}
.head .h_size1{ background:#b0a011;margin-right: 1rem;}
.head .h_size2{ background:#1b938e;}

.banner img{display:block;}
.banner .bn3{ position:relative;}
.banner .bn3 a{ position:absolute; display:block; left:50%; top:26%; margin-left:-0.8rem;animation: myfirst 1s infinite alternate linear;-moz-animation: myfirst 1s infinite alternate linear;-webkit-animation: myfirst 1s infinite alternate linear;-o-animation: myfirst 1s infinite alternate linear;}
.banner .bn3 a img{ display:block; width:5.3rem; height:1.8rem;}

.introduction{ padding:1.5rem 0 2.5rem;}
.introduction .img{ float:left; margin-right:1.1rem; width:12.2rem;}
.introduction .info{ position:relative; top:-0.5rem; line-height:2.2rem; color:#555555; overflow:hidden}
.introduction .info a{ display:block; margin-top:0.7rem;}
.introduction .info a img{ display:block; width:12.5rem; height:2.9rem; margin:0 auto}


.endanger{padding:2.3rem 0 2.5rem; background-color:#f2f2f2;}
.endanger .title{ padding-bottom:0.4rem; color:#349995;font-size:1.9rem; line-height:2rem; text-align:center;}
.endanger .tit{ text-align:center; color:#c4b214; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:2rem;  z-index:2;}
.endanger .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:28%; background-color:#dbcf64;}
.endanger .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:28%; background-color:#dbcf64;}
.endanger .xm{ margin-bottom:0.6rem;}
.endanger .xm1{ margin-bottom:1.7rem;}
.endanger .dec{ border:1px solid #e9e7e7; border-radius:0.3rem;-moz-border-radius:0.3rem;-ms-border-radius:0.3rem;-o-border-radius:0.3rem;-webkit-border-radius:0.3rem; background-color:#fff; height:9rem; width:48%;}
.endanger .dec .p1{ text-align:center; background-color:#78cac6; color:#fff; font-weight:bold; height:2.7rem; line-height:2.7rem;border-radius:0.3rem 0.3rem 0 0;-moz-border-radius:0.3rem 0.3rem 0 0;-ms-border-radius:0.3rem 0.3rem 0 0;-o-border-radius:0.3rem 0.3rem 0 0;-webkit-border-radius:0.3rem 0.3rem 0 0;}
.endanger .dec .p2{ padding:0.8rem 1rem 0; font-size:1.1rem; color:#666666;}
.endanger .que{ line-height:2.9rem; color:#333333; width:68%; margin:0 auto;}
.endanger .que .btn{ float:right; margin-left:0.6rem;}
.endanger .que .btn img{ width:8.9rem; height:2.9rem; display:block;}

.worse{padding:2.3rem 0 2.5rem;}
.worse .title{ padding-bottom:0.4rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.worse .tit{ text-align:center; color:#c4b214; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:1.9rem;  z-index:2;}
.worse .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:16%; background-color:#dbcf64;}
.worse .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:16%; background-color:#dbcf64;}
.worse .img img{ display:block;}
.worse .que{ line-height:2.9rem; color:#333333; width:86%; margin:0 auto; margin-top:1.7rem}
.worse .que .btn{ float:right; margin-left:0.6rem;}
.worse .que .btn img{ width:8.9rem; height:2.9rem; display:block;}

.wrong{padding:2.3rem 0 2.5rem; background-color:#f2f2f2;}
.wrong .title{ padding-bottom:0.4rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.wrong .tit{ text-align:center; color:#c4b214; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:2rem;  z-index:2;}
.wrong .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:28%; background-color:#dbcf64;}
.wrong .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:28%; background-color:#dbcf64;}
.wrong .img { margin-bottom:1.7rem;}
.wrong .img img{ display:block;}
.wrong .doc{ border:1px solid #e9e9e9; height:8.9rem; background-color:#fff; border-radius:8.9rem;-moz-border-radius:8.9rem;-ms-border-radius:8.9rem;-o-border-radius:8.9rem;-webkit-border-radius:8.9rem;}
.wrong .doc .doc_img{ background:url(images/wyy_22.jpg) no-repeat center center; background-size:contain; margin-left:0.7rem; width:5.5rem; height:5.5rem; border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;-webkit-border-radius:50%; margin-right:0.7rem; margin-top:1.7rem;}
.wrong .doc .info{ padding-right:2rem;}
.wrong .doc .info .p1{ font-weight:bold; color:#ed7f43; padding-top:1rem; line-height:1.5rem; padding-bottom:0.4rem;}
.wrong .doc .info .p2{ color:#555555; font-size:1.1rem; line-height:1.6rem;}



.technology{padding:2.3rem 0 2rem; background-color:#85c7c4;}
.technology .title{ padding-bottom:0.4rem; color:#f9ec24; font-size:1.9rem; line-height:2rem; text-align:center;}
.technology .tit{ text-align:center; color:#fff; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:2rem;  z-index:2;}
.technology .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:7%; background-color:#fff;}
.technology .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:7%; background-color:#fff;}
.technology .info{ padding:1.3rem; background-color:#d6f4f2; color:#555555; line-height:2.1rem; font-size:1.3rem; margin-bottom:1.1rem;}
.technology .info p{ margin-top:-0.3rem;}
.technology .info img{ float:right; width:10.3rem; height:11.8rem; margin-left:1rem;}
.technology .flex{ margin-bottom:1.8rem;}
.technology .list{ height:20.6rem; width:6.9rem; border-radius:6.9rem;-moz-border-radius:6.9rem;-ms-border-radius:6.9rem;-o-border-radius:6.9rem;-webkit-border-radius:6.9rem; padding-top:0.8rem;}
.technology .list .p1{ position:relative; width:5.4rem; height:4.5rem; border-radius:50%; background-color:#fff; font-size:1.5rem; line-height:1.8rem; font-weight:bold; text-align:center; padding-top:0.9rem; margin:0 auto; margin-bottom:1.2rem;}
.technology .list .p1:before{ content:""; display:block; position:absolute; border-top:0.6rem solid #fff; border-bottom:0; border-left:0.6rem solid transparent; border-right:0.6rem solid transparent; bottom:-0.5rem; left:50%; margin-left:-0.6rem;}
.technology .list .p2{ color:#d6f4f2; font-size:1.2rem; line-height:1.8rem; padding:0 1rem;}
.technology .btn{ width:15.6rem; margin:0 auto; display:block;animation: myfirst 1s infinite alternate linear;-moz-animation: myfirst 1s infinite alternate linear;-webkit-animation: myfirst 1s infinite alternate linear;-o-animation: myfirst 1s infinite alternate linear;}
.technology .btn img{ width:15.6rem; display:block;}
.technology .list1{ background-color:#409d99;}
.technology .list2{ background-color:#38a578;}
.technology .list3{ background-color:#4b94af;}
.technology .list4{ background-color:#6b74a0;}
.technology .list1 .p1{ color:#399893;}
.technology .list2 .p1{ color:#38a578;}
.technology .list3 .p1{ color:#4996b2;}
.technology .list4 .p1{ color:#566196;}

.contrast{ padding:2rem 0 1.8rem; background-color:#52adaa;}
.contrast .tit{ text-align:center; color:#fff; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:1.4rem;  z-index:2;}
.contrast .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:31%; background-color:#b5dbda;}
.contrast .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:31%; background-color:#b5dbda;}
.contrast .flex{ margin-bottom:0.7rem;}
.contrast .flex p{ width:23%; font-size:1.2rem; text-align:center;color:#fff; border:1px dashed #fff; height:1.9rem; line-height:1.9rem;}
.contrast .flex .p1{ color:#FF0; border-color:#FF0; width:25%}
.contrast .flex .pl{ position:relative; background-color:#cce6e5; color:#2d8b88; height:2rem; border:0; width:5.5rem;}
.contrast .flex .pl:after{ position:absolute; content:""; display:block; border-right:0; border-top:1rem solid #52adaa;border-bottom:1rem solid #52adaa;border-left:0.5rem solid #cce6e5; right:-0.5rem;top:0}
.contrast .flex .pt{ height:0; width:5.5rem; overflow:hidden; border:0}
.contrast .flex .pt1{ font-weight:bold; color:#FF0; border:0}
.contrast .flex .pt2{ font-weight:bold; border:0}
.contrast .flex .pt3{ font-weight:bold; border:0}


.ensure{padding:2.3rem 0 0;}
.ensure .title{ padding-bottom:0.4rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.ensure .tit{ text-align:center; color:#c4b214; position:relative; font-weight:bold; line-height:1.5rem; margin-bottom:1.8rem;  z-index:2;}
.ensure .tit:before{ content:""; display:block; position:absolute; left:0; top:50%; height:0.1rem; width:29%; background-color:#dbcf64;}
.ensure .tit:after{ content:""; display:block; position:absolute; right:0; top:50%; height:0.1rem; width:29%; background-color:#dbcf64;}
.ensure .pt{ text-indent:2em; line-height:2.2rem; color:#555555; margin-bottom:0.8rem;}
.adoc{ display:block;}

.zx{ padding-bottom:2.5rem}
.zx p{ width:49.5%; height:2.4rem; line-height:2.4rem; text-align:center; font-size:1.2rem;}
.zx .dec{ margin-bottom:0.2rem;}
.zx p a{ display:block; color:#fff;}
.zx .p1{ background-color:#71c9c5;}
.zx .p2{ background-color:#6cdaa7;}
.zx .p3{ background-color:#91c6e1;}
.zx .p4{ background-color:#abafdb;}
.zx .on{ width:5.8rem; height:5rem; margin-left:0.2rem;}
.zx .on a{ display:block; width:5.8rem; height:4rem; padding-top:1rem; background-color:#c4b214; font-weight:bold; color:#fff; font-size:1.2rem; text-align:center; line-height:1.5rem;}

.hos{ padding:2.3rem 0 2.5rem; background-color:#f2f2f2;}
.hos .title{ padding-bottom:1.9rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.hos .info{ margin-bottom:0.4rem;}
.hos .dec{ width:49.5%; background-color:#fff; height:18.1rem;}
.hos .dec img{ display:block;}
.hos .dec .p1{ font-weight:bold; color:#c4b214; text-align:center; padding:1.1rem 0 0.8rem}
.hos .dec .p2{ padding:0 1.4rem; color£º#555555; font-size:1.1rem;}
.hos .into{ height:11rem; background-color:#fff; margin-bottom:0.2rem;}
.hos .into img{ display:block; width:9.8rem; height:11rem; margin-right:1.5rem;}
.hos .into .p1{ font-weight:bold; color:#c4b214; padding:0.8rem 0 0.2rem;}
.hos .into .p2{ font-size:1.1rem; line-height:1.8rem; color:#555555; padding-right:1rem;}
.hos .fame{ background-color:#fff; text-align:center; font-weight:bold; color:#c4b214; line-height:1.5rem; padding:0 0.5rem 1.2rem; }
.hos .fame .pt{padding:1.2rem 0 0.8rem;}
#slider3{ position:relative; height:5rem; overflow:hidden}
.hos .fame ul{position:relative;}
.hos .fame li{ float:left; width:6.9rem; height:5rem;text-align:center;margin-right:0.8%;}
.hos .fame li img{ width:6.9rem; height:5rem;}

.cases{padding:2.3rem 0 2.5rem; }
.cases .title{ padding-bottom:1.9rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.cases .desc{ margin-bottom:1rem;}
.cases img{ display:block; height:7.9rem; width:7.5rem;}
.cases .info{ border:1px solid #d8eceb; border-radius:0.2rem;-moz-border-radius:0.2rem;-ms-border-radius:0.2rem;-o-border-radius:0.2rem;-webkit-border-radius:0.2rem; padding-left:2rem; height:7.8rem; margin-left:1rem; position:relative}
.cases .info1{ margin-right:1rem; margin-left:0; padding-left:0.8rem;}
.cases .info i{ position:absolute; display:block; background:url(images/sj1.jpg) no-repeat; width:0.7rem; height:1.4rem; background-size:contain; top:50%; margin-top:-0.7rem; left:-0.7rem;}
.cases .info b{ position:absolute; display:block; background:url(images/sj2.jpg) no-repeat; width:0.7rem; height:1.4rem; background-size:contain; top:50%; margin-top:-0.7rem; right:-0.7rem;}
.cases .info .p1{ color:#555555; font-weight:bold; margin-bottom:0.5rem; margin-top:1.2rem; line-height:1.5rem;}
.cases .info .p2{ font-size:1.1rem; line-height:1.8rem; color:#777777;}
.cases .info .p2 .sp1{ color:#c4b214}
.cases .info .p2 .sp2{ color:#349995}

.relate{ padding:2rem 0 1rem; background-color:#f2f2f2;}
.relate .title{ padding-bottom:1.4rem; color:#349995; font-size:1.9rem; line-height:2rem; text-align:center;}
.relate img{ display:block; width:9.5rem;}

.footer { background: #ffffff; padding-top:1.5rem;color: #fff;} 
.footer .f_nav {height:3rem; line-height:3rem; text-align:center; background-color:#349995;}
.footer .f_nav li { display:inline-block;}
.footer .f_nav li a { color: #fff; margin:0 0.5rem;}
.footer .copyright { padding:0 0 1rem 0; text-align: center; color: #666666; font-size:1.1rem; line-height:2rem;}
.footer .copyright a { color: #666666; }
.footer .dh{ width:50%; margin:0 auto;}
.footer .dh a{ color:#349995; font-size:1.2rem}

#quick-menu .arrow{  position:absolute; left:50%; bottom:0; font-size:2rem; color:#fff; margin-left:-2rem; width:4rem; height:3rem; line-height:1; text-align:center;}
#quick-menu{ position:relative;display:none; background-color:rgba(0,0,0,0.8); }
#quick-menu ul{padding:2rem 0 4rem; font-size:1.6rem;}
#quick-menu li{ height:3.4rem; line-height:3.4rem; padding:0 5rem;}
#quick-menu li a{ height:3rem; line-height:3rem; border-bottom:1px solid #999; color:#eee; display:block;}

@keyframes myfirst
{from { transform:translateX(-0.5rem);-moz-transform:translateX(-0.5rem);-ms-transform:translateX(-0.5rem);-o-transform:translateX(-0.5rem);-webkit-transform:translateX(-0.5rem)}to {transform:translateX(0.5rem);-moz-transform:translateX(0.5rem);-ms-transform:translateX(0.5rem);-o-transform:translateX(0.5rem);-webkit-transform:translateX(0.5rem);}}

@-moz-keyframes myfirst 
{from { transform:translateX(-0.5rem);-moz-transform:translateX(-0.5rem);-ms-transform:translateX(-0.5rem);-o-transform:translateX(-0.5rem);-webkit-transform:translateX(-0.5rem)}to {transform:translateX(0.5rem);-moz-transform:translateX(0.5rem);-ms-transform:translateX(0.5rem);-o-transform:translateX(0.5rem);-webkit-transform:translateX(0.5rem);}}

@-webkit-keyframes myfirst 
{from { transform:translateX(-0.5rem);-moz-transform:translateX(-0.5rem);-ms-transform:translateX(-0.5rem);-o-transform:translateX(-0.5rem);-webkit-transform:translateX(-0.5rem)}to {transform:translateX(0.5rem);-moz-transform:translateX(0.5rem);-ms-transform:translateX(0.5rem);-o-transform:translateX(0.5rem);-webkit-transform:translateX(0.5rem);}}

@-o-keyframes myfirst 
{from { transform:translateX(-0.5rem);-moz-transform:translateX(-0.5rem);-ms-transform:translateX(-0.5rem);-o-transform:translateX(-0.5rem);-webkit-transform:translateX(-0.5rem)}to {transform:translateX(0.5rem);-moz-transform:translateX(0.5rem);-ms-transform:translateX(0.5rem);-o-transform:translateX(0.5rem);-webkit-transform:translateX(0.5rem);}}

@media only screen and (min-width: 640px){
.wp { max-width: 640px; }

}
@media only screen and (max-width: 600px) {
.wp { max-width: 600px; }
html { font-size:100%;}

}
@media only screen and (max-width: 480px) {
.wp { max-width: 480px; }
html { font-size:75%;}

}
@media only screen and (max-width: 375px) {
.wp { max-width: 375px; }

}
@media only screen and (max-width: 360px) {
.wp { max-width: 360px; }
html { font-size:62.5%;}
}