@charset "gb2312";
/* CSS Document */
body{ margin:0; padding:0;}
/*div:after,ul:after { content:"\20"; display:block; height:0; clear:both; visibility:hidden;}*/
div,ul { zoom:1;*zoom:1 }
li{ list-style-type:none;}
.bgcolor{ background:#f2f2f2;}
 a{ color:#e33e54; text-decoration: none;}
.doc{overflow: hidden; text-align: left; font: 16px/1.5 Microsoft Yahei,tahoma,HELVETICA; color:#333; }
.doc .inner,.nav-inner{width:1100px; clear: both; margin:0 auto; overflow: hidden;}
* html,* html body{background-image:url(about:blank);background-attachment:fixed;}
*{margin:0;padding:0;}

.prev,.next { background:url(../images/img.png) no-repeat center center; cursor:pointer; width:50px; height:100px; position:absolute; float:left; z-index:5}
.iconfont{
  font-family:"iconfont" !important;
  font-size:16px;font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
@font-face {
  font-family: 'iconfont';
  src: url('../images/font/iconfont.eot');
  src: url('../images/font/iconfont.eot?#iefix') format('embedded-opentype'),
  url('../images/font/iconfont.woff') format('woff'),
  url('../images/font/iconfont.ttf') format('truetype'),
  url('../images/font/iconfont.svg#iconfont') format('svg');
}
.title{ display: block; margin: 50px auto 40px;  }

.header {width: 100%;  height: 90px; background:rgba(31,173,227,0.2); }
.header img{ display: block; float: left; margin-top: 15px;}
.header ul {float:right;width: 874px;height: 90px;position: relative;}
.header ul li { float:left; cursor: pointer; display:inline-block; font-size: 18px; height: 90px; line-height:90px;}
.header ul li a {float:left;color: #fff;display:block;font-size: 18px;margin: 0 9px;height: 90px;line-height:90px;}
/*.header ul li a:hover{ color:#4a89dc; border-bottom:2px solid #4a89dc;}*/
.header ul li.active{ color:#fff; background: #1da1d4;}
/*.header ul li.active a{color:#0f87f6;}*/
.header.fixed{ position:fixed; top:0; left:0; border:none; z-index:99; height:90px; background: #0d2e4e;}
/*.header .fixed.nav-bg{ background:#1a293c; background:rgba(17,23,37,0.9);filter:alpha(opacity=90);}*/
.header.fixed ul {font-size:18px; color: #333;}
.header.fixed ul li {  height: 90px; line-height: 90px; }
.header.fixed ul li a.active{ font-size:18px; color: #333;}
.header.fixed ul li a:hover{ -ms-animation:mywidth 1s infinite;/*ie*/
-moz-animation:mywidth 1s infinite; /* Firefox */
-webkit-animation:mywidth 1s infinite; /* Safari and Chrome */
-o-animation:mywidth 1s infinite; /* Opera */  }
/*.header.fixed ul li:hover{border-bottom:2px solid #4a89dc;}*/
.header .hot{ -ms-animation:mymove 1s infinite;/*ie*/
-moz-animation:mymove 1s infinite; /* Firefox */
-webkit-animation:mymove 1s infinite; /* Safari and Chrome */
-o-animation:mymove 1s infinite; /* Opera */ position: absolute; width: 31px; height: 21px; left: 738px; top:-3px}
#area1{ height: 815px;  margin: 0 auto; position: relative; overflow: hidden; background: url(../images/banner.jpg) no-repeat center top;}
/*#myVideo { position: absolute; width: 100%; top:0px; left: 0; overflow: hidden; height:650px ; background-size: 100% 100%; background-color: black; background-position: center center; background-size: contain; object-fit: cover; z-index: 3; }
#area1 .after { content: ""; position: absolute; top: 0px; left: 0; width: 100%; height:100%;  z-index: 5; background: #000; opacity: .7; filter: alpha(opacity=70) }*/
/*#area1 img{ display: block;z-index: 10; position: absolute; top:100px; left: 150px;}*/
/*#area1 .btn { position: absolute; width: 800px; height: 457px;   left: 50%; top: 15%; z-index: 9; }
*/
/*#area1 img{ display: block; position: relative; z-index: 20; top:15%; left: 0;   margin: 0 auto;}
*/
/*±¨Ãû½ø¶È¿ªÊ¼*/

.area2 .title{ margin: 20px auto 40px; }
.area2 .comtent{ background: url(../images/bg.jpg) no-repeat center top; height: 352px;}
.area2 p{ font-size: 14px;color: #333;  line-height: 24px; text-align: justify;}
.area2 .p1{ width: 225px; float: left; margin-top: 40px;}
.area2 .p2{ width: 230px; float: right;margin-top: 40px;}
.area2 .p3{ width: 225px; float: left; clear: both; margin-top: 72px;}
.area2 .p4{ width: 335px; float: right; margin-top: 25px;}

.area4{ background: #eaeaea; margin-top: 70px; padding-bottom: 50px;}
.area4 ul{ margin-right: -20px;}
.area4 ul li{ width: 540px; margin: 0 20px 20px 0; float: left; box-shadow: 1px 1px 5px #ddd;  height: 300px;padding-top: 20px; background: #fff; position: relative;}
.area4 ul li img{ width: 200px; height: 280px; position: absolute; left: 10px; top:10px; }
.area4 ul li h2{ width: 305px; padding-top: 11px; height: 89px; padding-left: 100px;  margin-left: 125px; font-size: 28px; color: #fff; line-height: 38px; background: #1fade3;}
.area4 ul li p{  padding-left: 100px; margin: 16px 0; font-size: 18px; color: #080e29; padding-left: 225px;}
.area4 ul li h3{ padding-left: 30px; background: url(../images/zc.png) no-repeat left top; margin-left: 196px; line-height: 37px; color: #fff; font-size: 18px;}
.area4 ul li h1{ padding-left: 225px; margin-top: 12px; color: #080e29; font-size: 36px;}
.product ul { height:501px; position:relative; }
.product li { width:350px; height:238px; display:inline; float:left; overflow:hidden; margin-right:30px; margin-bottom:25px; position:relative; }
.productli a { display: inline-block; width:320px; height:213px; position:relative; float:left; overflow:hidden; }
.product .Icon_L, .product .Icon_R { display: block; width: 350px; height: 100%; position:absolute; top:0; }
.product .Icon_L { left:-350px; background:url(../images/bg_left.png) 0 0 repeat-y; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=crop, src='../images/bg_left.png');
}
.product .Icon_R { background:url(../images/bg_right.png) 0 0 repeat-y; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=crop, src='../images/bg_right.png');
left:350px; }
.product .tit-s { display: block; width:100%; height:35px; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000, endColorstr=#90000000);
background:rgba(0, 0, 0, 0.7); font:16px/35px "Microsoft YaHei"; color:#fff; text-align:center; position:absolute; bottom:0px; left:0px; }
.product .txt-p { position:absolute; top: 35%; left: 8%; margin-top:-10%; color:#fff; display:none; overflow:hidden; width: 85%; height:118px; font:16px/28px "Microsoft YaHei"; }
.product li.first { position:absolute; right:0; width:340px; height:500px; margin-right:0; }
.product li.first a img { width:340px; height:500px; }
.area5 .title{ margin: 75px auto 40px;}
.area55{ padding-bottom: 55px;}

.area55 ul li img{ width: 350px; height: 238px;}
.area55 .title{ margin-top: 75px;}
.area55 a{  font-size: 18px; text-align: center; clear: both; color: #0f87f6; margin: 25px auto 0; display: block; width: 196px; height:48px; line-height: 48px; border: solid 1px #0f87f6; border-radius: 5px;}
.area5 .comtent{ height: 373px; position: relative; width: 1467px; margin: 0 auto; background: url(../images/yc.jpg) no-repeat center top;}
.area5 p{ font-size: 22px;color: #333; text-align: justify; position: absolute;}
.area5 p span{ font-weight: bolder;}
.area5 .p1{ width: 123px; top:196px; left: 217px;}
.area5 .p2{ width: 119px; top:-3px; left: 399px;}
.area5 .p3{ width: 123px; top:196px; left: 580px;}
.area5 .p4{ width: 117px; top:-3px; left: 762px;}
.area5 .p5{ width: 117px; top:196px; left: 944px;}
.area5 .p6{ width: 145px; top:-3px; left: 1117px;}
.area5 .add{ display: block; margin: 0 auto 15px;}
.area7{ background: url(../images/bg1.jpg) no-repeat center top; padding-bottom: 60px;}
.area7 .title{ margin: 50px auto 40px;}
.area7 .comtent{ background: url(../images/jb.jpg) no-repeat center top; height: 447px;}
.area7 p{ font-size: 18px; color: #333; width: 395px; margin:0 auto ; padding-top: 285px; line-height: 30px; text-align: justify; text-indent: 2em;}
.area8 .title{ margin: 75px auto 40px;}
.area8 .inner{ background: url(../images/zn.jpg) no-repeat center top; height: 600px;}
    .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
    .iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
.area3 .bg_bg { background: url(../images/bg2.jpg) no-repeat center top; padding-top: 60px; height: 460px;}
.area3 .title{ margin-top: 75px;}
.area3 .left{width:199px;background: url(../images/bg8.jpg) no-repeat bottom right;border-left: solid 1px #080e29;border-bottom: solid 1px #080e29;float:left;}
.area3 .left li{width:98px;color: #333;border-top: solid 1px #080e29;border-right: solid 1px #080e29;height:49px;float: left;line-height: 49px;font-size: 18px;cursor:pointer;text-align:center;background: #08365e;color: #1ea7dc;}
.area3 .left .active{width:98px;height:49px;background: #1fade3;color:#fff;}
.area3 .box1{ width:890px; float: right; height: 400px; overflow: hidden;}
.m-ilist {margin-right:-20px;}
.m-ilist li{float: left;display: block;width: 150px;height:174px;line-height: 20px;padding: 9px;margin: 0 10px 11.4px 0;*position: relative;text-align: center;border: 1px solid #e7e7e7;transition: all 0.2s cubic-bezier(0.42, 0, 0.58, 1) 0;background: #fff;}
.m-ilist li:hover{transition: all 0.2s cubic-bezier(0.42, 0, 0.58, 1) 0;}
.m-ilist li .u-img img {width: 150px;height: 150px;max-width:150px;max-height: 150px;*position: absolute;*top: 3px;*left: 3px;}
.m-ilist li a {height: 150px;color: #666; font-size: 12px;}
.m-ilist li strong {display: block;width: 100%;text-align: center;overflow: hidden;line-height:24px;height:24px; overflow:hidden;padding: 0;font-weight: normal;
}
.bomb{ width: 317px; display: none; margin-top: -60px; margin-left: -159px; height: 205px; background: #fff;   position:absolute; left:50%; z-index: 8; top:50%;border:#cabfc1 solid 1px; -moz-border-radius: 10px; -webkit-border-radius: 10px;  border-radius:10px; }
.bomb .close{ display: block; margin-left: 83px; border-radius: 5px; -webkit-border-radius: 5px; border: none; cursor: pointer; height: 55px; line-height: 55px;color: #fff; font-size: 21px; font-family: "Î¢ÈíÑÅºÚ"; float:left; background: #0f87f6;width: 155px; text-align:center; }
.bomb .icon19{ font-size: 95px; line-height: 175px; left: 187.5px; color: #999; display: block; margin: 0 auto;}
.bomb h3{font-size: 20px;color: #000;text-align: center;line-height: 60px;margin-top: 35px; font-family: "Î¢ÈíÑÅºÚ";}

.bomb1{ width: 500px;margin-top: -60px; display: none; margin-left: -251px; height: 220px; background: #fff;   position:absolute; left:50%; z-index: 8; top:50%;border:#395e7e solid 1px; -moz-border-radius: 20px; -webkit-border-radius: 20px;  border-radius:10px; }
.bomb1 .close{ display: block; margin: 20px 20px 0 83px; background: url(../images/close.png) no-repeat center top;  cursor: pointer; height: 39px; line-height: 39px; float:right; width: 39px; text-align:center; }
.bomb1 h3{font-size: 30px;color: #080e29;text-align: center; font-family: "Î¢ÈíÑÅºÚ"; margin: 33px 0 18px 0;}
.bomb1 .p1{font-size: 20px;color: #666;padding: 0 70px 0 58px; font-family: "Î¢ÈíÑÅºÚ"; line-height: 36px;}





.area6{background: url(../images/bg1.jpg) repeat-y center top; padding-bottom: 70px;}
.area6 .title{ margin: 0 auto 40px; padding-top: 60px;}
.area6 .top {  margin: 0 auto 30px;margin-right: -40px; float: left;}
.area6 .top li {width:340px; float: left; background: #838383; text-align: center; margin-right: 40px;   height:60px;  font-size:28px; line-height:60px; border-radius: 5px; -webkit-border-radius: 5px; color:#fff;  cursor:pointer; }
.area6 .top li.active{ background: #0f87f6;}
.area6 .bottom{ width: 1100px;}
.area6 .bottom li{ display: block; margin: 0 auto;} 
.area9{ height: 650px; position: relative;}
.area9 p{ font-size: 13.96px; color: #08365e; padding-left: 158px; line-height: 29.91px;}
table td{ position: relative; }
table{border-top: solid 1px #ddd; margin: 30px auto; border-right: solid 1px #ddd;}
table td{ color: #333; height: 42px; text-align: right; padding-right: 30px;  margin-top: 5px; font-size: 18px;  border-bottom: solid 1px #ddd; }
table{  border-left: solid 1px #ddd;}
table td.one{ border-left: solid 1px #ddd;  }
table td.two{ background: url(../images/line.jpg) no-repeat right center;}

.radio1{ position: absolute; left:70px ; padding: 0; top: 20px; background: transparent; width: 25px; height: 25px;}
.span1{ position: absolute; left:100px ; line-height: 30px; top: 17px; padding: 0; font-size: 18px;} 
.radio2{ position: absolute; left:165px ;padding: 0; top: 20px; background: transparent; width: 25px; height: 25px;}
.span2{ position: absolute; left:195px ;  top: 17px; padding: 0; line-height: 30px;}
input[type="text"]{ background:transparent; outline: none; border: 0; color: #333; padding-left: 15px; font-size: 16px; height: 60px; width: 100%; padding-left: -20px;}
input[type="submit"]{ background: #08365e;  border-radius: 5px; outline: none; border: 0; display: block; margin:  0 auto; color: #fff; line-height: 55px;  font-size: 24px; height: 55px; width:300px; margin-bottom:15px ; }
.area10 { background: url(../images/bottom.jpg) no-repeat center top; height: 410px; margin-top: 55px;}







.page{ padding:30px 5px 60px 0}
.page A{ background:#ebebeb; border:0; padding: 4px 10px 4px 10px;  -moz-border-radius: 5px;      /* Gecko browsers */ -webkit-border-radius: 5px;   /* Webkit browsers */border-radius:5px; color:#6c6c6c; }
.page .currentPage{ background:#0f87f6;padding: 4px 10px 4px 10px;  -moz-border-radius: 5px;      /* Gecko browsers */ -webkit-border-radius: 5px;   /* Webkit browsers */border-radius:5px; color:#FFF;}
/*backToTop*/
.backToTop { display:none; width:18px; line-height:1.2; padding:5px 0; background-color:#0f87f6; color:#fff; font-size:12px; text-align:center; position:fixed; _position:absolute; right:10px; bottom:100px; _bottom:"auto"; cursor:pointer; opacity:1; filter:Alpha(opacity=100); }

@keyframes mymove{
  0% {
   transform:scale(1,1);
-ms-transform:scale(1,1); 
-moz-transform:scale(1,1); 
-webkit-transform:scale(1,1); 
-o-transform:scale(1,1); 
  }

  50%{
    transform: scale(1.2,1.2);
    -ms-transform:scale(1.2,1.2); 
-moz-transform:scale(1.2,1.2); 
-webkit-transform:scale(1.2,1.2); 
-o-transform:scale(1.2,1.2); 
  }
    100%{
    transform: scale(1,1);
    -ms-transform:scale(1,1); 
-moz-transform:scale(1,1); 
-webkit-transform:scale(1,1); 
-o-transform:scale(1,1); 
  }
}

@-webkit-keyframes mymove{
0% {
   transform:translateY(1,1);
-ms-transform:rotate(1,1); 
-moz-transform:rotate(1,1); 
-webkit-transform:rotate(1,1); 
-o-transform:rotate(1,1); 
  }
  50%{
        transform: rotate(1.2,1.2);
    -ms-transform:rotate(1.2,1.2); 
-moz-transform:rotate(1.2,1.2); 
-webkit-transform:rotate(1.2,1.2); 
-o-transform:rotate(1.2,1.2); 
  }
  100%{
        transform: rotate(1,1);
    -ms-transform:rotate(1,1); 
-moz-transform:rotate(1,1); 
-webkit-transform:rotate(1,1); 
-o-transform:rotate(1,1); 
  }
}


@keyframes mywidth{
  0% {
 transform:translateX(0px)
  }

    100%{
transform:translateX(100%)
}

    100%{
transform:translateX(0%)
}

@keyframes mywidth{
  0% {
 transform:translateX(0px)
  }

    100%{
transform:translateX(100%)
}

    100%{
transform:translateX(0%)
}









 