﻿/*

公司网址:www.dlptt.com

maimang

*/
body{ font-family: "微软雅黑";}
.h100{ height: 100px; }

.w1200{margin:0 auto;width:1200px}

.head{height:100px;background:#fff; position: fixed; width: 100%; left: 0; top: 0; z-index: 999;}

.head .logo{float:left;/* margin-top:30px;width:250px; */}

/* .head .logo img{ } */

.head .nav{float:right;margin-top:50px}

.head .nav li{font-size:16px; float:left;text-align:left;font-weight:300}

/*.head .nav li:last-child{text-align:right}*/

.head .nav li a{color:#666}

.head .nav li a:hover{color:#3474cb}

.head .nav li.on a{color:#3474cb}

/* .small{ height: 100px; } */

/* .small .logo{ width:90px;margin-top: 13px;} */

/* .small .nav{margin-top:24px} */

.banner .swiper-pagination-bullet{width:12px;height:12px;background:#fff}

.banner img{width:100%}

.indexlist{margin:60px auto 180px auto}

.indexlist li{float:left;margin-right:30px;width:380px}

.indexlist li:last-child{margin-right:0}

.indexlist li .img{/*overflow:hidden;*/width:100%}

.indexlist li .img img{width:100%;transition:all .6s}

.indexlist li .img:hover img{transform:scale(1.1)}

.indexlist li p{margin-top:18px;color:#333;text-align:center;font-size:16px}

.foot{margin-top:100px;padding:10px 0 40px 0;color:#7f7f7f;text-align:center}

.foot a{color:#7f7f7f}

.foot a:hover{color:#333}

.foot .icon{margin:0 auto 30px auto;width:180px;text-align:center}

.foot .icon .list{position:relative;float:left;width:33.3333%}

.foot .icon .list img{width:32px}

.foot .icon .list .webui-popover{position:absolute;bottom:40px;left:-30px;display:none;width:120px; z-index: 9999;}

.foot .icon .list .webui-popover .webui{box-sizing:border-box;width:100%;border:1px solid #eee;background:#fff}

.foot .icon .list .webui-popover .webui img{width:100%}

.foot .icon .list .arrow{position:absolute;bottom:-8px;left:60px;display:block;margin-left:-9px;width:0;height:0;border-color:transparent;border-style:solid;border-width:9px;border-top-color:#a8bbc2;border-top-color:rgba(204,213,219,.85);border-bottom-width:0}

.foot .icon .list .arrow:after{position:absolute;bottom:1px;display:block;margin-left:-8px;width:0;height:0;border-color:transparent;border-style:solid;border-width:8px;content:" ";border-top-color:#fff;border-bottom-width:0}

.about .title{margin-top:70px;text-align:center}

.about .title h4{color:#333;text-transform:uppercase;font-weight:400;font-size:24px}

.about .title p{margin-top:14px;color:#999;font-size:20px}

.about .title p:after{display:block;margin:0 auto;margin-top:16px;width:30px;height:2px;background:#e3dedf;content:""}

.about .text{margin-top:20px;color:#999;line-height:32px}

.about .text p{font-size:16px}

.imglist{ margin: 0 auto 150px auto; }
.imglist li{ width: 380px; height: 280px; margin: 30px 30px 0 0; float: left;  position: relative; overflow: hidden;}
.imglist li:nth-child(3n){ margin-right: 0; }
.imglist li .imgdiv{ width: 100%; height: 100%; overflow: hidden; position: relative; }
.imglist li .imgdiv img{ width: 100%; }
.imglist li  .mask{ position: absolute;  left:0;top: 0; height: 50%;background:rgba(60,125,210,.4); width: 50%; transition:all .5s; }
.imglist li  .mask1{ position: absolute; right:0;top: 0; height: 50%;background:rgba(60,125,210,.4); width: 50%; transition:all .5s; } 
.imglist li  .mask2{ position: absolute; left:0;bottom: 0; height: 50%;background:rgba(60,125,210,.4); width: 50%; transition:all .5s; } 
.imglist li  .mask3{ position: absolute; right:0;bottom: 0; height: 50%;background:rgba(60,125,210,.4); width: 50%; transition:all .5s; } 
.imglist li:hover  .mask{left:-50%; top: -50%;}
.imglist li:hover  .mask1{right:-50%; top: -50%;}
.imglist li:hover  .mask2{left:-50%; bottom: -50%;}
.imglist li:hover  .mask3{right:-50%; bottom: -50%;} 



.contact{ margin-top: 60px; }

.contact .form{ float: left;  width: 700px;}

.contact .form p{ font-size: 14px; line-height: 26px; color: #999;  margin-bottom: 30px;}

.contact .form h4{ font-size: 16px; color: #333;  font-weight: 500; margin-bottom: 9px;}

.contact .form input.text{ height: 40px; border-radius: 4px; border:1px solid #ddd;  width: 100%; background: #fafafa; margin-bottom: 25px; padding: 0 10px; box-sizing:border-box; display: block;}

.contact .form input.button{ cursor: pointer; border:1px solid #3474cb; width: 130px; height: 40px; border-radius: 4px; color: #3474cb; font-size: 18px; transition: all 800ms;}

.contact .form input.button:hover{ background: #3474cb; color: #fff; border-radius: 0px;}

.contact .address{ float: right; border-bottom: 1px solid #dddddd; width: 400px; padding-bottom: 12px;  line-height: 26px;}

.contact .address .list{ font-size: 15px;  color: #666; margin-bottom: 15px;}



.news li{ padding: 20px; border:1px solid #dddddd; overflow: hidden; margin-top: 30px; }

.news li .text{ width: 880px; float: left;padding:0;line-height:1; }

.news li .text .title{ font-size: 18px; margin-top: 20px; }

.news li .text .title a{ color: #333; display: block; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; }

.news li .text .title a:hover{ color: #3474cb; }

.news li .text .time{ font-size:14px; color: #999; margin: 20px auto 30px auto; }

.news li .text .zhaiyao{ font-size:14px; color: #999;  line-height: 24px; }

.news li .pic{ float: right; width: 240px; overflow: hidden;  }

.news li .pic img{ width: 100%; transition: all .5s;}

.news li .pic:hover img{ transform: scale(1.1); }

.mod18{width:1200px;margin:0 auto;position:relative; margin-top: 20px; text-align:center;}

.mod18 .btn{position:absolute;width:20px;height:38px;top:115px;cursor:pointer;z-index:99;font-size:50px;font-weight:bold;}

.mod18 .prev{left:-30px;background:url(../images/prevBtn.png) no-repeat;}

.mod18 .next{right:-30px;background:url(../images/nextBtn.png) no-repeat;}

.mod18 li{float:left;}

.mod18 .cf li{position:relative;}

.mod18 .picBox{ width: 1200px; height:440px;position:relative;overflow:hidden; background: #f5f5f5; }

.mod18 .picBox ul{position:absolute;}

.mod18 .picBox li{width:1200px;padding: 40px; box-sizing: border-box; overflow: hidden;}

.mod18 .picBox li .text{ float: left;  }

.mod18 .picBox li .text h3{ font-size: 25px;  margin-bottom: 20px; margin-top: 240px;}
.mod18 .picBox li .text h4{ font-size: 14px; }
.mod18 .picBox li .text p{ font-size: 18px;  font-weight: 300; text-align: justify; line-height: 30px;}

.mod18 .picBox li .text .more{ width: 100px; height: 30px; line-height: 30px; border-radius: 30px; border:1px solid #dddddd; margin-top: 20px; transition: all 800ms;}

.mod18 .picBox li .text .more a{ display: block; text-align: center; color: #333; }

.mod18 .picBox li .text .more:hover{ background: #3474cb; border:1px solid #3474cb; }

.mod18 .picBox li .text .more:hover a{ color: #fff; }

.mod18 .picBox li .pic{float: right;  overflow: hidden; display: table-cell; vertical-align: middle; text-align: center;}

.mod18 .picBox li .pic img{transition: all .5s;}

.mod18 .picBox li .pic:hover img{ transform: scale(1.1); }

.mod18 .listBox{width:1200px;height:240px;margin:0 auto;position:relative;overflow:hidden;/*background-color: white;*/}

.mod18 .listBox ul{height:100px;position:absolute; padding-top: 20px;}

.mod18 .listBox li{width:150px;height:200px;cursor:pointer;position:relative;}

.mod18 .listBox li:nth-child(6n){ margin-right: 0px }

.mod18 .listBox li img{width:140px;height:180px; display: block; margin:0 auto; transition: all 600ms}

.mod18 .listBox .on img{width:140px;height:180px; transform:translateY(-20px); }

.mod18 .listBox img:hover{transform:translateY(-20px);}

.mod18 .listBox .on .arr2{position: absolute;left: 50%;bottom: 20px;margin-left: -10px;width:0px;height:0px;border-width:20px;border-style:solid;border-color:transparent transparent #f5f5f5 transparent;}

.page{  margin:80px auto 0 auto; display: table; }
.page a{ color:#666; border:1px solid #ddd; background:#fff; font-size:14px; float:left; display:block; margin-right:5px; padding: 0 15px; height:40px; box-sizing:border-box; text-align:center; line-height:40px; border-radius:4px;}
.page a.prev{ width:88px; margin-right:5px;}
.page a.next{ width:88px; margin-right:0; margin-left:0px;}
.page span{ color:#fff; border:1px solid #ddd; background:#6ccbf7; font-size:14px; float:left; display:block; margin-right:5px; padding: 0 15px;height:40px; box-sizing:border-box; text-align:center; line-height:40px; border-radius:4px;}
.page a:hover{ background:#6ccbf7; color:#fff;}
.page a.active{ background:#6ccbf7; color:#fff;}

.news_con_title {font-size: 18px;font-weight: bold;line-height: 36px;text-align: center;height: 36px;margin-top:5%;}

.news_con_top {border-bottom: 1px dashed #e9e9e9;color: #3b3b3b;font-size: 14px;text-align: center;line-height: 40px;margin: 0px auto;margin-bottom: 14px;overflow: hidden;padding-bottom:10px;}
.news .text{ padding:30px 0 40px 0; line-height: 30px; }
.news .text .clearboth{clear:both;}
 .info-page {
    margin-top: 45px;
    padding: 15px 0 70px;
    border-top: 1px solid #eee;
    width: 100%;
    margin: 0 auto;clear:both;
    }
    .info-page p{ height: 30px; line-height: 30px; }
  .info-page p a:hover{
       background: transparent;
        text-decoration: none;
        color: #0058a0;
    }
.videolist { position:relative; float:left; }
.videolist:hover{ cursor: pointer; }
.videoed { display:none; width:50px; height:50px; position: absolute; left:45%; top:45%; z-index:99; border-radius:100%; }
.videos{ display:none; border: 1px solid #080808; position:fixed; left:50%; top:50%; margin-left:-320px; margin-top:-150px; z-index:100; width:720px; height:72px; }
.vclose { position:absolute;right:1%; top:1%; border-radius:100%; cursor: pointer; }