﻿
/*-----------------[初始化]--------------*/
body{color: #333;font-size: 12px;line-height: 1.5;font-family:"微软雅黑","Microsoft Yahei";background: #f0f0f0;}
a{color: #333;text-decoration: none;}
a:hover{color: #00aeff;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;}
img{max-width: 100%;}
input,textarea,select{font-size: 12px;color: #333;
    font-family:"微软雅黑","Microsoft Yahei";outline: 0;
}
*{  
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
  }
input[type='submit'],input[type='reset'],input[type='button'],select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
input[type='submit'],input[type='reset'],input[type='button']{cursor: pointer;}
::-webkit-input-placeholder {color: #999;}
::-moz-placeholder {color: #999; }
::-ms-input-placeholder {color: #999;}

ul li{list-style:none;}
.ani{
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
/*布局*/
.wp{width: 100%;max-width:1100px;margin: 0 auto;}
.h50{height: 50px;clear: both;overflow: hidden;}
.h100{height: 100px;clear: both;overflow: hidden;}
.l{float: left;}
.r{float: right;}
.col-l{float: left;}
.col-c{float: left;}
.col-r{float: right;}
.tc{text-align: center;}
.h{height: 10px;}
/*公用*/
/*.g-tit-1{line-height: 76px;font-size: 40px;color: #00aeff;text-align: center;padding:80px 0 70px;}
.g-tit-1 span{font-weight: lighter; font-size: 14px; display: block;line-height: 28px;color: #444;}
.g-tit-1.tit-2{text-align: left;font-weight: lighter;width: 494px;line-height:65px;padding:70px 0 0 16px;}
.g-tit-1.tit-2 span{color: #969696;letter-spacing:1.2px;}
.g-tit-1.tit-3{color: #444;}*/
.g-btn1{
      display: inline-block; padding: 0 15px;height:35px;line-height:35px;
      font-size: 14px;text-transform: uppercase;border:1px solid #fff;
      border-radius: 15px; color: #fff;margin-top: 10px;
}
.g-btn1:hover{background: #fff;color: #0e4aad;}
.g-btn2{margin-bottom: 15px; border: 0; padding: 0;margin: 0;display: block; text-align: center; border-bottom: 1px solid #dbe0e8;border-radius: 0;}

.g-tit1{color: #0e4aad;font-size: 34px; line-height: 30px;margin-bottom: 25px;padding-bottom:8px;border-bottom: 1px solid #0e4aad;font-weight: lighter;display: inline-block;}

.g-tit2{font-size: 16px; color: #0e4aad;text-align: center;border-bottom:1px solid #0e4aad; line-height: 40px;
  padding: 50px 0 20px;}
.g-tit2 span{font-size: 30px;text-transform: uppercase;display: block;}

.g-tit3{
    font-size: 18px; color: #db850c;padding-left: 10px;line-height: 12px;margin: 25px 0 15px;border-left: 3px solid #db850c;
    font-weight: lighter;
}


/*head*/
#hd{height: 200px;background:#0e4aad repeat-x 0 0;}
.head{position: relative;height: 200px;background: url(../images/head-pic.png) no-repeat 0 0;}
.logo{padding-top: 30px;float: left;}
.logo img{width: 236px;display: block;border: 0;outline: none;}
.logo p{line-height: 30px; font-size: 13px; color: #fff;}
#nav{position: absolute;right: 0;bottom: 20px;padding-top:80px;}
#nav ul li{text-transform: uppercase;font-size: 14px;
  line-height: 25px;padding-left: 15px; background: url(../images/nav-li.png) no-repeat 0 center;
  background-size: 4px;}
#nav ul li a{display: block;color: #fff;}
#nav ul li a:hover,#nav ul li.on a{color: #cfdff8;}

/*banner*/
#banner {display: block; margin:40px 0; width: 100%; }
#banner .items-pic{padding-top: 5%;min-height: 180px;background-repeat: no-repeat;background-position: center center;position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;}
#banner .items-pic .txt{
    position: absolute; width: 100%;  left: 0;bottom: 0;z-index: 99;background:url(../images/banner-bg.png) repeat-y center top; 
    padding:12px 0 30px;
}
#banner .items-pic .txt h5,.items-pic .txt p{color: #fff;padding:0 400px 0 20px;}
#banner .items-pic .txt h5{font-size: 22px;margin: 0;}
#banner .items-pic .txt p{font-size: 14px;}
#banner .slick-dots{width: 100%;text-align: center;position: absolute; bottom:10px;}
#banner .slick-dots li{display: inline-block; font-size: 0; }
#banner .slick-dots li a{display: block; margin:0 5px; width: 10px; height: 10px; background: #eee; border-radius: 50%;}
#banner .slick-dots .slick-active a{background: #666;}

/*手机按钮*/
#nav-more{
    display: none;width:35px;height:35px;float: right;margin:15px 15px 0 0;
    background: url(../images/nav-more.png) no-repeat center center;
}

/*底部*/
#ft{background:#0e4aad repeat-x;}
.wp-bg{background: url(../images/foot-pic.png) no-repeat center bottom;overflow: hidden;}

#ft p{text-align: right;color: #fff;padding:20px 0;}

/*==========index=========*/

/*Info*/
.m-Info{overflow: hidden;border:1px solid #ddd;}
.m-Info .col-l,.m-Info .col-r,.m-Info .col-c{height: 500px;font-size: 16px;}
.m-Info .col-l,.m-Info .col-r{width: 28%;background: #dbe0e8;padding: 50px 30px 0;line-height: 25px;}
.m-Info .col-c{width: 44%;background: #fff;color: #666;position: relative; padding:50px 65px 0;line-height: 2;float: right;}
.m-Info p{padding-bottom: 20px;}
.m-Info span{font-weight: bold;}

.m-Info .col-l.on,.m-Info .col-r.on{background: #0e4aad;color: #fff;}
.m-Info .arr-l,.m-Info .arr-r{display: block;width: 19px;height: 36px;position: absolute;z-index: 9;background-repeat: no-repeat;}
.m-Info .arr-l{left: -18px;top: 120px;background: url(../images/arr-l.png) right center;}
.m-Info .arr-r{right: -18px; bottom: 120px;background: url(../images/arr-r.png) left center;}

/*about us*/
.m-about .txt{padding:20px 50px;font-size: 16px;line-height: 32px;}
.m-about .txt p{padding: 10px 0;}

.m-picshow ul{overflow: hidden;margin:0 -10px; padding: 50px 0;}
.m-picshow ul li{float: left; width: 25%;padding:0 10px;}
.m-picshow ul li .pic{padding-top: 75%;position: relative;}
.m-picshow ul li .pic img{position: absolute; top: 0; left: 0; width: 100%;height: 100%;}
.m-picshow ul li .masking{display: block;position: absolute;z-index: 99; background: rgba(0,0,0,0.6);text-align: center;
   vertical-align: middle;top: 0;left: 0;width: 100%; height: 100%;color: #fff;cursor: pointer;}

/*GARNET ABRASIVE*/
.m-article{padding-top: 20px;}
.m-article .txt1{font-size: 14px; line-height:35px;padding:30px 50px;overflow: hidden;}
.m-article img{display: block; max-width: 100%; margin: 0 auto;}
.m-article .txt2{padding:20px 15px;font-size: 14px;}
.txt-l{float: left;width: 28%;}
.txt-r{float: right;width: 70%;line-height: 35px;}
.txt-r strong{padding-bottom: 20px;}
.txt-l ul{margin: 0;padding: 0;}
.txt-l ul li{margin-bottom: 20px;}
.txt-l ul li img{display: block;}

.ul-tit{padding: 20px 0;}
.ul-tit li{line-height:22px;padding: 10px 0 10px 30px; font-size: 14px;color:#999;background: url(../images/ul-tit.png) no-repeat 8px center;}


.g-tab{width: 100%;margin:40px 0;}
.g-tab.tab-tm{margin:0 0 40px;}
.g-tab th{line-height:40px;background: #0e4aad;color: #fff;text-align: left;padding-left: 10px;}
.g-tab td{text-align: center;border: 1px solid #ddd;height: 40px;}
.g-tab tr:nth-last-child(odd){background: #e1e1e1;}

.td-width{width: 260px;}