@charset "utf-8";

/*
 * Author: https://github.com/happyfreelife
 * Org: http://www.68team.com
 * Date: 2017-10-26
 */

/****************************** Normalize ******************************/
*, *:before, *:after{box-sizing: border-box;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, ul, ol, li, dl, dd, input, button, textarea, fieldset, legend, figure, menu, th, td, pre{margin:0;padding:0;}
body{min-width: 1200px;max-width: 1920px;margin: 0 auto;overflow-x: hidden;font-size: 12px;font-family: "Microsoft YaHei", "Arial", "PingFang SC", sans-serif;color: #666;background: #f5f5f5;}
h1, h2, h3, h4, h5, h6{font-weight: normal;font-size: inherit;}
a{color: #999;text-decoration: none;outline: none;}
img{border: none;}
ul, ol{list-style: none;}
i, em{font-style: normal;}
input, button, select, textarea, optgroup{font: inherit;color: inherit;outline:none;}
input[type="text"], input[type="password"], input[type="search"], button, textarea{border: 1px solid #ccc;}
input[type="button"], input[type="reset"], input[type="submit"], button{border: none;cursor:pointer;}
input[type="radio"], input[type="checkbox"]{border: none;padding:0}
input::-ms-clear, input::-ms-reveal{display: none;}
button[disabled], input[disabled]{cursor:default}
button::-moz-focus-inner, input::-moz-focus-inner{padding:0;border:0}
legend{padding:0;border:0}
textarea{resize: none;}
table{border-collapse: collapse;}
td, th{padding:0}

body,h1,h2,h3,h4,h5,h6,p,dl,dd,ul,ol,input{margin:0;padding:0}em,i{font-style:normal}li{list-style:none}a,a:hover{text-decoration:none}img{border:0}table{border-collapse:collapse;border-spacing:0}label{cursor:default}textarea{resize:none}a,a:focus{outline:none}.clearfix:after{content:'\20';display:block;height:0;clear:both}.clearfix{*zoom:1}.clear{display:block;height:0;clear:both;font-size:0;line-height:0;overflow:hidden}.fl{float:left;display:inline}.fr{float:right;display:inline}.fn{float:none}.tl{text-align:left}.tr{text-align:right}.tc{text-align:center}.hide{display:none}.show{display:block}.mt10{margin-top:10px}.noBg{background:none!important}.noBorder{border:0!important}.red{color:red}.mb15{margin-bottom:15px}body,button,input,select,textarea{font:12px/1.5 Tahoma,Arial,'Hiragino Sans GB','microsoft yahei',\5b8b\4f53}
body{background: #fff;width:100%;font-family: 'microsoft yahei';}
.g-in{width: 1200px;margin: 0 auto;}

/****************************** Global Style ******************************/
.fl{float: left;}
.fr{float: right;}
.tac{text-align: center;}
.tar{text-align: right;}
.mr0{margin-right: 0 !important;}
.bd0{border-width: 0 !important;}
.center{margin-left: auto;margin-right: auto;}
.rps{display: block;max-width: 100%;}
.upload img{height: auto !important;max-width: 100%;}
.container{width: 1200px;margin: 0 auto;}
.container, .wrapper, .box{position: relative;}
.container:after, .wrapper:after, .box:after, .clearfix:after{content: "";display: block;clear: both;}


/****************************** Icon Sprite ******************************/
footer .share a,
.floater a,
.banner-index .tb-arrow a,
.banner-index .down i,
.index-product .icon li:before,
/*.index-application .category li .text a,*/
.index-application .box .arrow a,
.index-news ul li .text .detail,
.index-partner .logo .arrow{background:none;background-image: url(http://cn.ochemate.com/img/icon.png);background-repeat: no-repeat;}


/****************************** CSS3 Transition ******************************/
.floater a em,
.banner-index .tb-arrow a,
.index-application .category li .text,
.index-news ul li{-webkit-transition: all .3s;transition: all .3s;}


/****************************** Common Part ******************************/
header{position: fixed;top: 0;left: 0;width: 100%;z-index: 999;background: #fff;box-shadow: 0 1px 20px rgba(0, 0, 0, .2);}
header .logo{float: left;background: url(/public/img/logo3.png) no-repeat;width: 210px;height: 64px;margin: 8px 0;}
header ul{float: left;margin: 0px 0 0 80px;}
header ul li{/*position: relative;*/float: left;background:url(http://cn.ochemate.com/img/navline.gif) left center no-repeat;}
header ul li > a{display: block;line-height: 80px;font-size: 15px;color: #333;text-transform: uppercase;padding: 0 19px;transition:all 0.3s linear;background:url(http://cn.ochemate.com/img/navbg.gif) bottom center no-repeat;background-size:0px 2px;}
/*header ul li:after{content: "";position: absolute;top: 3px;right: 0;height: 14px;border-right: 1px solid #ddd;}
header ul li:last-child:after{content: none;}*/
header ul li > a.active,
header ul li > a:hover{color: #ec1b23;background:url(http://cn.ochemate.com/img/navbg.gif) bottom center no-repeat;background-size:67px 2px;}
header .lang{float: right;margin-top: 30px;}

header .lang a{line-height: 20px;font-size: 14px;color: #666;display:inline-block;}
header .lang em{display:inline-block;width:8px;}
header + .placeholder{height: 80px;}

header .meb{float:right;display:inline-block;margin-right:30px;position:relative;height:80px;line-height:80px;cursor:pointer;}   
header .meb .man{font-size:14px;color:#333;margin-right:8px;}
header .meb img{position:relative;top:-4px;}
header .meb .back{width:100px;height:30px;text-align:center;line-height:30px;font-size:14px;color:#666;background-color:#fff;border-radius:3px;box-shadow:0px 0px 20px rgba(0,0,0,0.2);position:absolute;left:0px;top:54px;opacity:0;transition:all 0.3s linear;}
header .meb:hover .back{top:64px;opacity:1;}


header .container{position: static;}
header .slideNav{position:absolute;left:0px;top:80px;background-color:#fff;width:100%;padding:60px 0px 60px;display:none;box-shadow:0px 1px 20px rgba(0,0,0,0.2);}
header .slideNav .g-in{position:relative;z-index:10;}
header .slideNav:before{content:"";display:none;position:absolute;left:0px;top:0px;width:39%;height:100%;background-color:#f5f5f5;z-index:0;}



header .slideNav .navL{float:left;width:360px;display:none;}
header .slideNav .navL h3{font-size:24px;color:#333;padding-top:30px;position:relative;}
header .slideNav .navL h3:before{content:"";display:block;width:42px;height:4px;position:absolute;left:2px;top:0px;background-color:#ff0000;}
header .slideNav .navL .txt{font-size:14px;color:#666;padding-top:20px;}
header .slideNav .navL .more{display:block;width:112px;height:36px;text-align: center;line-height:35px;text-transform:uppercase;color:#999;border:1px solid #ddd;margin-top:40px;border-radius:26px;font-family:Arial;font-size:12px;transition:all 0.2s linear;}
header .slideNav .navL .more:hover{background-color:#d6000f;color:#fff;border-color:#d6000f;}

header .slideNav .navR{float:left;padding-left:0px;}
header .slideNav .navR dl{float:left;margin-right:30px;width:200px;}
header .slideNav .navR dl dt{font-size:16px;margin-bottom:12px;}
header .slideNav .navR dl dt a{color:#ff0000;}
header .slideNav .navR dl dd{margin-bottom:8px;}
header .slideNav .navR dl dd a{color:#666;font-size:14px;line-height:20px;padding-left:1px;transition:all 0.2s linear;display:block;}
header .slideNav .navR dl dd a:hover{color:#ff0000;transform:translateX(-6px);}


footer{padding-top: 55px;background: #333;}
footer dl{float: left;width: 970px;border-right: 1px solid #444;position:relative;}
footer dl dt{line-height: 40px;font-size: 24px;color: #fff;text-transform: capitalize;float: left;width: 200px;height: 200px;margin-top:-6px;}
footer dl dt:after{content: "";display: block;width: 30px;margin-top: 10px;border-bottom: 2px solid #d6000f;margin-left:3px;}
footer dl dd{float: left;line-height: 28px;font-size: 14px;width: 460px;color: #fff;}
footer dl .ewm{position:absolute;right:100px;top:8px;text-align:center;font-size:12px;color:#fff;width:80px;}
footer .share{float: right;margin-top:-1px;}
footer .share span{display: block;line-height: 30px;font-size: 14px;text-transform: capitalize;color: #fff;text-indent: 12px;}
footer .share a{float: left;margin: 20px 0 0 12px;width: 25px;height: 25px;}
/*footer .share a:nth-of-type(1){background:none;}
footer .share a:nth-of-type(2){background:none;}
footer .share a:nth-of-type(3){background:none;}*/



footer .bottom{margin-top: 70px;background: #2e2e2e;}
footer .bottom p,
footer .bottom p a{line-height: 50px;color: #fff;text-transform: capitalize;}

.floater{position: fixed;top: 50%;right: 2px;-webkit-transform: translateY(-50%);transform: translateY(-50%);z-index: 10;}
.floater a{position: relative;display: block;width: 50px;height: 50px;border-radius: 3px;background-color: #dedede;margin-bottom: 2px;}
.floater a:nth-child(1){background-position:0 -50px;}
.floater a:nth-child(2){background-position:-50px -50px;}
.floater a:nth-child(3){background-position:-100px -50px;}
.floater a:nth-child(4){background-position:-150px -50px;}
/*.floater a:nth-child(5){background-position:-200px -50px;}*/
.floater a:nth-child(5){background-position:-250px -60px;background-color: #d6000f;font-size: 14px;text-transform: uppercase;line-height: 70px;text-align: center;color: #fff;;}
.floater a em{position: absolute;top: 0;left: 0;width: 100%;line-height: 50px;background-color: #d6000f;color: #fff;color: #fff;opacity: 0;text-align: center;text-transform: capitalize;}
.floater a.active em,
.floater a:hover em{opacity: 1;}

.share .bdsharebuttonbox a{height:25px !important;}
.share .bdsharebuttonbox .bds_weixin{background:url(http://cn.ochemate.com/images/wx.png) center no-repeat !important;}
.share .bdsharebuttonbox .bds_tsina{background:url(http://cn.ochemate.com/images/wb.png) center no-repeat !important;}
.share .bdsharebuttonbox .bds_qzone{background:url(http://cn.ochemate.com/images/kj.png) center no-repeat !important;}
.bdimgshare-bg{display:none;}
.bdimgshare-content{display:none;}
.jiathis_counter_style{display:none !important;}
.bd_weixin_popup{box-sizing:content-box;}
.share .jiathis_style_24x24 .jtico_jiathis{display:none  !important;}



/****************************** Page Component ******************************/
.banner-top{position: relative;overflow: hidden;}
.banner-top img{position: relative;left: 50%;display: block;margin-left: -960px;}


/****************************** Index ******************************/
.index-section-title{padding-top: 70px;text-align: center;line-height: 32px;font-size: 34px;color: #333;text-transform: uppercase;letter-spacing: 2px;}
.index-section-title em{color: #d6000f;}
.index-section-title:after{content: "";display: block;margin: 30px auto 0;width: 30px;border-bottom: 2px solid #aaa;}

.banner-index img{display: block;width: 100%;}
.banner-index .tb-arrow{width: 90%;left: 5%;}
.banner-index .tb-arrow a{width: 36px;height: 72px;margin-top: -36px;opacity: 0;}
.banner-index .tb-arrow a.prev{background-position:-332px -214px;}
.banner-index .tb-arrow a.next{background-position:-432px -214px;}
.banner-index:hover .tb-arrow a{opacity: 1;}

.banner-index .container{position: absolute;top: 14.52%;left: calc(50% - 600px);}
.banner-index .container h1{font: bold 56px/120px 'microsoft yahei';color: #fff;text-align: center;text-transform: uppercase;}
.banner-index .container dl{float: left;width: 250px;margin: 90px 75px 0px 75px;text-transform: capitalize;}  
.banner-index .container dl dt{font: /* bold */ 22px/40px "Arial";color: #fff;border-bottom: 1px solid rgba(255, 255, 255, .5);margin-bottom: 10px; font-family:'microsoft yahei';}
.banner-index .container dl dd a{line-height: 24px;font-size: 14px;color: #fff;transition:all 0.3s linear;}
.banner-index .container dl dd a:hover{color: #ec1b23;}
.banner-index .container dl:last-of-type{margin-right: 0;}
.banner-index .down{position: absolute;bottom: 6.37em;left: 50%;margin-left: -18px;width: 36px;height: 36px;border-radius: 50%;border: 1px solid #fff;}
.banner-index .down i{width: 8px;height: 24px;margin: -6px auto 0;background-position:-21px -13px;display: block;}

.index-product .icon{padding-top: 20px;overflow: hidden;margin-top: -36px;background: #d6000f;}
.index-product .icon li{float: left;width: 400px;position: relative;}
.index-product .icon li:before{content: "";display: block;width: 60px;height: 60px;margin: 0 auto;}
.index-product .icon li:nth-child(1):before{background-position:-20px -220px;}
.index-product .icon li:nth-child(2):before{background-position:-120px -220px;}
.index-product .icon li:nth-child(3):before{background-position:-220px -220px;}
.index-product .icon li span{display: block;line-height: 50px;font-size: 20px;color: #fff;text-align: center;text-transform: capitalize;}
.index-product .icon li em{position: absolute;font-size: 46px;width: 30px;line-height: 30px;top: 20px;right: -15px;color: #fff;}

.index-product .tit{font-size:32px;text-align:center;text-transform:uppercase;padding-bottom:20px;background:url(http://cn.ochemate.com/img/ptitline.gif) bottom center no-repeat;padding-top:60px;}
.index-product .tit span{color:#ec1b23;padding-right:12px;}


.index-product .list{margin-top: 60px;}
.index-product .list:after{content: "";display: block;clear: both;}
.index-product .list li{float: left;width: 400px;text-align: center;}
.index-product .list li a{display: block;width: 200px;height: 200px;margin: 0 auto;overflow: hidden;border-radius: 50%;box-shadow: 0 0 30px rgba(100, 100, 100, .1);overflow: hidden;position: relative;background: #fff;}
.index-product .list li a img{display: block;width: 100%;border-radius: 50%;}
.index-product .list li a:after{content: "+";position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-transition: all .5s;transition: all .5s;border-radius: 50%;font-size: 40px;line-height: 200px;text-align: center;color: #fff;background: rgba(0, 0, 0, .5);opacity: 0;}
.index-product .list li a:hover:after{opacity: 1;}
.index-product .list li h3{margin-top: 36px;line-height: 18px;font-size: 18px;color: #d6000f;text-transform: uppercase;}
.index-product .list li p{line-height: 24px;font-size: 14px;margin-top: 14px;}
.index-product .list li a:hover{box-shadow:3px 3px 30px rgba(0,0,0,0.2)}



.index-application{position: relative;margin-top: 70px;background: url(http://cn.ochemate.com/img/bg-index-application.jpg) no-repeat center top;padding-bottom:60px;background-size:cover;background-attachment:fixed;}


.index-application .tit{font-size:32px;text-align:center;text-transform:uppercase;padding-bottom:20px;background:url(http://cn.ochemate.com/img/ptitline.gif) bottom center no-repeat;padding-top:60px;}
.index-application .tit span{color:#ec1b23;padding-right:12px;}

.index-application .category{margin-top:62px;}
.index-application .category li{height: 520px;overflow: hidden;cursor:pointer;}
.index-application .category li img{display: block;position: relative;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.index-application .category li .text{position: absolute;top: 460px;width: 100%;padding: 0 8.5%;left: 0;transition:all 0.5s linear;}
.index-application .category li .text h3{line-height: 18px;font-size: 18px;color: #fff;text-transform: uppercase;}
.index-application .category li .text h3:after{content: "";display: block;margin-top: 32px;width: 18px;border-bottom: 3px solid #d6000f;}
.index-application .category li .text p{margin-top: 18px;line-height: 30px;font-size: 14px;color: #fff;display: -webkit-box;overflow: hidden;-webkit-box-orient: vertical;-webkit-line-clamp: 3;}
.index-application .category li .text a{display: block;margin-top: 20px;width: 45px;height: 45px;border-radius: 50%;background:url(http://cn.ochemate.com/img/jtt.png) no-repeat;background-position:-37px center;border-radius: 50%;transition:all 0.3s linear;background-color: rgba(255, 255, 255, .7);}
.index-application .category li .text a:hover{background-position:13px center;background-color:#ec1b23;}

.index-application .category li:hover .text{-webkit-transform: translate3d(0, -200px, 0);transform: translate3d(0, -200px, 0);}

.index-application .box{position: absolute;width: 20%;height: 670px;top: 79px;background: #fff;z-index: 1;left: 20%;padding: 0 20px;}
.index-application .box h2{line-height: 58px;font-size: 32px;color: #333;text-transform: uppercase;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;letter-spacing: 1px;margin-top: 75px;}
.index-application .box p{margin-top: 28px;line-height: 28px;text-transform: capitalize;font-size: 16px;}
.index-application .arrow_in{text-align:center;padding-top:60px;}
.index-application .arrow{width: 46px;height: 46px;border: 2px solid #bfbfbf;position: relative;display:inline-block;box-sizing:border-box;transition:all 0.3s linear;}
.index-application .arrow.prev{background:url(http://cn.ochemate.com/img/prev.png) center no-repeat;border-right:none;}
.index-application .arrow.prev:hover{background:url(http://cn.ochemate.com/img/prevf.png) center no-repeat;background-color:#ec1b23;border-color:#ec1b23;}
.index-application .arrow.next{background:url(http://cn.ochemate.com/img/next.png) center no-repeat;border-left:2px solid #bfbfbf;}
.index-application .arrow.next:hover{background:url(http://cn.ochemate.com/img/nextf.png) center no-repeat;background-color:#ec1b23;border-color:#ec1b23;}

.index-news{background: url(http://cn.ochemate.com/img/bg-index-news.jpg) no-repeat center top;height: 740px;background-size:cover;background-attachment:fixed;}
.index-news ul{margin-top: 46px;}
.index-news ul li{float: left;width: 376px;margin-right: 36px;box-shadow: 0 0 20px rgba(100, 100, 100, .1);transition:all 0.3s linear;cursor:pointer;position:relative;/*top:80px;opacity:0;*/}
.index-news ul li:last-child{margin-right: 0;}
.index-news ul li:hover{box-shadow: 0 5px 20px rgba(0,0,0,0.5);transform: translateY(-10px);-webkit-transform: translateY(-10px)}
.index-news ul li .thumb{display: block;overflow: hidden;}
.index-news ul li .thumb img{display: block;width: 100%;-webkit-transition: all 1s;transition: all 1s;}
.index-news ul li .text{padding: 34px 24px 42px;background: #fff;overflow: hidden;}
.index-news ul li .text h3{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.index-news ul li .text h3 a{line-height: 20px;font-size: 18px;color: #333;letter-spacing: .5px;text-transform: uppercase;}
.index-news ul li .text p{line-height: 24px;margin-top: 18px;font-size: 14px;text-transform: uppercase;display: -webkit-box;overflow: hidden;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.index-news ul li .text span{float: left;margin-top: 36px;line-height: 18px;font-size: 14px;color: #999;}
.index-news ul li .text .detail1{float: right;margin-top: 30px;width: 34px;height: 34px;box-shadow: 0 0 10px rgba(100, 100, 100, .2);background:url(http://cn.ochemate.com/img/jtt.png) no-repeat;background-position:-42px center;border-radius: 50%;transition:all 0.3s linear;}
.index-news ul li:hover{box-shadow: 0 0 20px rgba(100, 100, 100, .3);}
.index-news ul li:hover .thumb img{-webkit-transform: scale(1.05);transform: scale(1.05);}
.index-news ul li:hover .text .detail1{box-shadow: none;background-color: #d6000f;background-position:8px center;}

.index-about{background: url(http://cn.ochemate.com/img/bg-index-about.jpg) no-repeat center top;overflow: hidden;padding-bottom:110px;background-color:#f5f5f5;}
.index-about .container{margin-top: 250px;background: #fff;padding-bottom: 70px;box-shadow: 0 0 20px rgba(100, 100, 100, .1);position:relative;top:80px;opacity:0;}
.index-about p{line-height: 30px;margin-top: 35px;font-size: 14px;text-align: center;padding: 0 150px;}
.index-about a{display: block;margin: 50px auto 0;width: 140px;line-height: 35px;font-size: 12px;text-transform: uppercase;text-align: center;box-sizing:border-box;border:1px solid #d7d7d7;color:#666;transition:all 0.3s linear;border-radius:2px;}
.index-about a:hover{background: #d6000f;color: #fff;border:1px solid #d6000f;}


.index-partner .logo{margin: 50px 0 100px;position: relative;padding: 0 120px;}
.index-partner .logo li{height: 60px;position: relative;margin-left: 1px;}
.index-partner .logo li img{display: block;max-height: 100%;max-width: 80%;position: relative;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.index-partner .logo li:after{content: "";position: absolute;height: 30px;top: 15px;border-right: 1px solid #ddd;right: 0;}
.index-partner .logo li.swiper-slide-prev:after{content: none;}
.index-partner .logo .arrow{position: absolute;width: 40px;height: 40px;top: 10px;border-radius: 50%;background-color: #fff;box-shadow: 0 0 10px rgba(100, 100, 100, .2);}
.index-partner .logo .arrow.prev{background-position:-105px -105px;left: 0;}
.index-partner .logo .arrow.next{background-position:-155px -105px;right: 0;}
.index-partner .logo .arrow:hover{background-color: #d6000f;background-position-y: -155px;box-shadow: none;}

@media (max-width: 1440px) {
	.index-application .box{width: 25%;left: 25%;}
}
/*.ke-zeroborder ,.ke-zeroborder td,.ke-zeroborder th{
border:0px solid #000 !important;
border-collapse:collapse;
}*/