* { font-size:14px; font-family:"Microsoft YaHei"; }
a { color:#000; text-decoration:none; }
a:hover { color:#03a083;text-decoration:none; }
body { margin:0px; padding:0px;background:#fff; }
input,select{background:#fff;}
/*div { word-wrap: break-word; word-break: normal; }*/
ul, li, ol, li { margin:0px; padding:0px; list-style:none; word-wrap: break-word; word-break: normal; }
h1, h2, h3, h4, h5, h6, p, dl, dt, dd, form { margin:0px; padding:0px; font-weight:normal; word-wrap: break-word; word-break: normal; }
img { border:0px; vertical-align:middle; }

.clear { clear:both; }
.flex{ display: flex;}
.justify-content{justify-content: space-between; align-items: center;}
.top{ background:#000; }
.top .top-box{line-height:40px; }
.top .s-login { float: right;}
.top .t-logo{ float: left;}
.top .t-logo a{ color: #fff;}
.top .s-login a{ display: inline-block; padding-left:10px; color: #fff;}
.header{padding: 20px 0; background: url(../images/tpbarf9ax.png)  bottom left; position: relative;z-index: 2;}
.header-box{ padding:0 0;  /*  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);*/}
.header .logo{ float: left; padding: 10px 0; width: 280px;white-space:nowrap;word-break:keep-all; overflow:hidden; text-overflow:ellipsis; }
.header h1{ line-height:58px; font-weight: bold;font-size: 20px;/* padding-left: 20px;*/}
.header h1 a{color:#fff;font-size: 20px;}
.header h1 a:hover{ color:#333;}
.header .tel{ float: right; margin-top:5px;}
.header .tel .ico{ font-size: 20px; font-weight: 100;}
.header .tel .ico span{ font-size:24px; margin-right: 15px;padding-right:15px;  color: #000; display: inline-block; position: relative;}
.header .tel .ico span:after{ content: ''; display: inline-block; top:8px; bottom:8px; right: 0; width: 1px; margin-left: 5px; background: #cfcfcf; position: absolute;}
.nav{float:  right;}
.nav ul{ float: left; padding:24px 0;}
.nav ul li{float: left; position:relative;font-size:18px;line-height:30px;color:#03a083;display: flex;align-items: center;justify-content: space-between; margin: 0 2px;}
.nav ul li a{ color: #333; display: inline-block; padding:0 15px; }
.nav ul li:last-child{ margin-right: 0;}
/*.nav ul li.s:after{ content: ''; display:inline-block; position: absolute;  bottom: 10px; left: 0; right: 0; height: 2px; background: #03a083;}*/
.nav ul li.s a{ color:#fff; /*font-weight: bold;*/}
.nav ul li.s,.nav ul li:hover{ background: #03a083;}
.nav ul li:hover:not(.s)>a {background: 0 0;color:#fff;}
.banner{ position: relative; margin-top: -20px;}
.banner .item a{ display:block; height: 560px; width: 100%; background-repeat: no-repeat; background-position: center center; background-size:cover;}
.banner .owl-pagination{ position:absolute; left:0px; right:0px; bottom:10px; text-align: center;}
.banner .owl-theme .owl-controls .owl-page span{width: 12px;height: 12px;background-color: #b2b2b2;border-radius: 100%;border: 4px solid transparent;margin: 0 7px;box-sizing: border-box;background-clip: content-box;transition: all .36s ease;}
.banner .owl-theme .owl-controls .owl-page.active span, 
.banner .owl-theme .owl-controls.clickable .owl-page:hover span{background-color: transparent;border: 2px solid rgb(203, 157, 78);background: #fff;}
.bg{ background:#f7f7f7 ;}
.in-product,.in-supply{ padding: 60px 0 60px;}
.in-supply{/* background: url(../images/s4-bg.jpg) no-repeat center center;background-size: cover;*/}
.in-tit{position: relative; text-align:left;margin-bottom:30px; padding-left: 30px;}
.in-tit p {position: relative;z-index: 2;line-height: 1;}
.in-tit p a{font-size:30px;color:rgb(34, 34, 34);}
.in-tit h4 {position: relative;z-index: 2;line-height:45px;margin-top: 0; font-weight: bolder;}
.in-tit h4 a{font-size: 36px;color: rgb(34, 34, 34); text-transform: uppercase;}
.in-tit em {position: absolute;left: 0;top: 0; z-index: 1;font-size: 160px; color: transparent;font-style: normal;font-weight: 700;line-height: 1;text-overflow: ellipsis; white-space: nowrap;overflow: hidden;}
.in-tit em:first-letter{color: #d9e3fe;}
.in-tit h4:after{ content: ''; display: inline-block; left:-30px; width:3px; top:10px; bottom: 15px;background:#333; position: absolute;}
.in-s-tit{ text-align:  center;font-size: 30px; color: #333; line-height:24px; margin: 20px 0;}
.in-s-tit span{ color: #666; display:block; font-size: 14px; margin-top: 10px;}
.tit{ font-size: 20px; color: #555; line-height: 50px; margin: 20px 0;}
.tit span{font-size: 14px;color: #bbb;line-height: 26px; display: inline-block; padding-left: 10px;}
.in-product{ background:#fff;}
.product-div.in-product{ background: #fff; padding: 30px 0 50px;}
.product-div.in-product ul{ padding: 0;}
.in-product ul{ padding: 20px 0 0 0;}
.in-product li{ margin-bottom:30px;}
.product-div.in-product li{ margin-bottom: 20px;}
.in-product>li>a{ display: block;transition: all 0.36s ease; border: solid 1px #ddd; padding: 5px;}
.in-product li:hover a{box-shadow: 0px 12px 64px rgba(0, 0, 0, 0.1);}
.in-product li .thumb{ position: relative; overflow: hidden; height:180px; overflow: hidden;}
.in-product li .thumb img{transition: all .36s ease;}
.in-product li:hover .thumb img{-webkit-transform: scale(1.08);-ms-transform: scale(1.08);transform: scale(1.08);}
.in-product li .thumb p:before{content: '';width: 21px;height: 1px;line-height: 40px;margin-left: -10px;top: 0; background: #fff;display: inline-block;position: absolute;left: 50%; z-index: 10; transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;opacity: 0;}
.in-product li .thumb p:after{content: '';width: 1px;height: 21px;line-height: 40px;left: 50%;margin-top: -10px;background: #fff;display: inline-block;position: absolute; top: 0;left: 50%;z-index: 10;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;opacity: 0;}
.in-product li .thumb:after{transition: all 0.36s ease;content: "";width: 100%;height: 0;background-color: rgba(0, 0, 0, 0.5);position: absolute;top: 0px;opacity: 0;left: 0;}
.in-product li:hover .thumb:after{ opacity: 1; height: 100%;}
.in-product li:hover .thumb p:before,.in-product li:hover .thumb p:after{ top: 40%; opacity: 1;}
.in-product li h3{text-align:center;line-height:60px;white-space:nowrap;word-break:keep-all;overflow:hidden;text-overflow:ellipsis;  font-size:14px; color:#333;transition: all 0.36s ease;}
.product-div.in-product li h3{ color: #666;}
.in-product li:hover h3{}
.in-product .more-btn{ z-index: 999; text-align:center; margin-top: 30px;}
.in-product .more-btn a{display: inline-block; padding:8px 0; width: 200px; border: solid 1px #03a083; border-radius: 20px; overflow: hidden; color:#03a083;}
.in-product .more-btn a:hover{ background:#03a083; border-color:#03a083; color:#fff;}
.in-product li img{ max-width: 100%;}
.in-product .item{ margin: 0 15px 15px; padding:10px; border: solid 1px #ddd; background: #fff;}
.in-product .item a{ display: block;transition: all 0.36s ease;}
.in-product .item:hover{box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);}
.in-product .item .thumb{ position: relative;}
.in-product .item .thumb p:before{content: '';width: 21px;height: 1px;line-height: 40px;margin-left: -10px;top: 0; background: #fff;display: inline-block;position: absolute;left: 50%; z-index: 10; transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;opacity: 0;}
.in-product .item .thumb p:after{content: '';width: 1px;height: 21px;line-height: 40px;left: 50%;margin-top: -10px;background: #fff;display: inline-block;position: absolute; top: 0;left: 50%;z-index: 10;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;opacity: 0;}
.in-product .item .thumb:after{transition: all 0.36s ease;content: "";width: 100%;height: 0;background-color: rgba(0, 0, 0, 0.5);position: absolute;top: 0px;opacity: 0;left: 0;}
.in-product .item:hover .thumb:after{ opacity: 1; height: 100%;}
.in-product .item:hover .thumb p:before,.in-product .item:hover .thumb p:after{ top: 50%; opacity: 1;}
.in-product .item h3{line-height:50px; font-size: 16px; color: #666;transition: all 0.36s ease;}
.in-product .item:hover h3{ padding: 0 15px;}
.in-product .item img{ max-width: 100%;}


.in-supply{ padding: 150px 0; background-image: url(../images/youshi.jpg);background-repeat: no-repeat; background-position: center top; background-attachment: fixed;position: relative;}
.in-supply::after{ content: ''; display: inline-block; position: absolute;bottom: 0; left: 0; right:0 ; background: #fff; top:50%; z-index: 1;}
.in-supply-box{ background: #fff; padding: 50px; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); position: relative; z-index: 2;}
.in-supplu-side{ width: 30%; padding: 50px; float: left; background:#03a083; height:500px;}
.in-supplu-side h3{ font-size: 36px; font-weight: normal; color: #fff; text-align: center;}
.in-supplu-side h6{ padding: 40px 0; color: #fff; font-size: 24px; line-height: 45px; text-align: center;}
.in-supplu-side .more{ text-align: center; padding: 50px 0;}
.in-supplu-side .more a{ display: inline-block; padding:15px 45px; border: solid 1px #fff; color: #fff;}
.in-supplu-list{}
.in-supplu-list .item{ padding: 0 3px;}
.in-supplu-list .img-bg{ width: 100%; height: 300px; overflow: hidden; background-position: center center; background-repeat: no-repeat; background-size:contain;}
.in-supplu-list h3 a{ font-size: 16px; color:#666;}
.in-supplu-list h3 span{ float: right; color: #666;}
.in-supplu-list .desc{ margin: 10px 0 0; line-height: 30px; height: 60px; overflow: hidden; color: #999;}
.in-supplu-list ul{  border-top: solid 1px #eee; margin-top:10px; padding-top: 20px;}
.in-supplu-list ul li h3 a{font-size: 14px; color:#000;}
.in-supplu-list ul li{ padding: 3px 0; line-height: 24px;}
.in-supplu-list .in-sup-item{ background:rgb(245, 245, 245); padding: 30px;}

.in-supplu-list .in-sup-item h3{ font-size: 20px; padding-top: 30px; color: #666; font-weight: 100; position: relative;}
.in-supplu-list .in-sup-item h3::after{ content: ''; position: absolute; left: 0; top:10px; width: 30px; height: 1px; background: #03a083;}
.in-supplu-list .in-sup-item .date{ margin-top: 10px;}

.in-footer-box{  position: relative; z-index: 2;}

.in-about{ padding:150px 0 100px;}
.in-about-box{ position: relative; /*padding:50px 0; background: url(../images/ABOUTUS.png) no-repeat;*/ }
.about-img{ position: absolute; width: 510px; left: -50px; top: -50px;}
.about-img img{ width: 100%;}
.in-about-info{text-align: left; top:10%;padding: 40px 40px 40px 520px;background: #fff; z-index: 999; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);}
.in-about-info h3{line-height: 60px; color: #333; font-size: 24px; font-weight:100;}
.in-about-info h3 strong{ color:#03a083;font-size:36px;font-weight: 600; display: inline-block; margin-right: 10px;}
.in-about-info .text{ line-height: 30px; height: 180px; overflow: hidden; margin-top: 10px;}
.in-about-info .more-btn a{ display: inline-block; padding:8px 40px; border: solid 1px #03a083; background:#03a083; border-radius: 20px; overflow: hidden; color: #fff;transition: all 0.3s ease 0s;}
.in-about-info .more-btn a:hover{ background:#03a083;}
.in-about-info .more-btn{ text-align: right; margin-top: 30px;}
.in-about-contactus{background-color: #eef1f6;border: 1px solid #cfd7e7;padding: 60px;position: absolute;left: 53px;top: -81px;width: 450px;}
.in-about-contactus h3{ line-height: 50px;}
.in-about-contactus li{ line-height: 40px;}
.in-about .in-about-bg{ margin-top: 20px;}


.in-footer{ background-image: url(../images/home_about_bg.jpg);}
.in-footer-bg{ position: relative;}
.in-footer-item{padding:30px 0; line-height:32px; color: #fff;}
.in-footer-item h3{ margin-bottom:60px; text-align: center; font-size: 28px; color: #fff;}
.in-footer-item p{ font-size: 18px; font-weight: 100;}
.in-footer-item .footer-item{ position: relative; padding-left:50px;}
.in-footer-item .footer-item span{ padding-right: 5px; font-size: 32px; color: #fff; position: absolute; top: 0px; left: 0;}
.in-footer-code-box{ text-align: center; padding: 30px 0 0 0;}
.in-footer-code{ width:160px; margin: 0 30px; display: inline-block; text-align: center;background: #fff; padding-bottom: 5px;}
.in-footer-code .thumb{}
.in-footer-code img{ width: 140px;padding:10px 0 5px; }
.in-footer-code .t{ font-size: 14px; line-height:24px; text-align: center;}
.in-join{}
.in-join .in-join-title{ width: 40%; float: left; padding: 30px 5% 20px 0; text-align: right;}
.in-join .in-join-title h3{ margin-top:28px; color:#233975 ;}
.in-join .in-join-title h3 span{font-size: 14px;color: #bbb;line-height: 26px;display: inline-block;padding-left: 10px;}
.in-join .in-join-title p{ line-height: 40px; color: #999;}
.in-join .in-join-info{ width: 60%; float: right;background: #233975; position: relative; padding: 35px 0;}
.in-join .in-join-info .text{ position: absolute; top: 20%; left: 10%; color: #fff;}
.in-join .in-join-info .text p{ font-size: 26px; padding: 5px 0;}
.in-join .in-join-info .text p.j-btn{ padding: 10px 0;}
.in-join .in-join-info .text p.j-btn a{ display: inline-block; padding: 5px 20px; border: solid 1px #ddd; border-radius:15px; color: #fff; overflow: hidden;}
.main-product{ width: 620px; margin: 0 10px 0 120px; text-align: center;}
.main-product img{ width: 80px;}
.main-product h3{ color:rgba(255,255,255,.6); font-weight: normal; font-size: 12px; text-align: center; line-height:18px; padding-top: 10px;}
.owl-buttons{ position:absolute;z-index:99999; height:64px; top:50%; margin-top: -32px; left:-64px; right:-64px;}
.owl-buttons div{transition: all 0.36s ease; background-color: rgba(0,0,0,.2); background-repeat: no-repeat; background-position: center center;}
.owl-buttons div:hover{ background-color:#03a083;}
.owl-next{ position:absolute; background-image:url(../images/owl-next.png);top:0px; z-index:99999; right:15px; width:64px !important; height:64px !important; text-indent:-9999999px; background-size: 32px;}
.owl-prev{ position:absolute; background-image:url(../images/owl-prev.png);top:0px; z-index:99999; left:15px; width:64px !important; height:64px !important; text-indent:-9999999px;background-size: 32px;}
.footer{ padding:20px 0; background: #141414; line-height: 30px;}
.footer p{ text-align: center; color: #989898;}
.footer p a{ color:#989898; display: inline-block; padding: 0 15px;}
.in-footer{ padding:50px 0; position: relative;}
.in-footer-box-bg{ content: ''; display: inline-block; position: absolute; left:0; right:0; top: 0; bottom: 0; background: #000; opacity: .3; z-index: 1;} 
.in-footer-text{ position:relative;background: #232323 url(../images/new-19022801.png) no-repeat 0 -10% / auto 70%; padding: 5% 5% 5% 10%; text-align:left; color: #fff;}
.in-footer-text .wx-coder{ width: 180px; top:40px; position: absolute; right:50px;}
.in-footer-text .wx-coder .thumb{ width: 130px; float: left;}
.in-footer-text .wx-coder img{ width: 130px;}
.in-footer-text .wx-coder .t{ width: 30px; float: right;}
.in-footer-text h3{ font-size: 26px; font-weight: 100; line-height: 40px;}
.in-footer-text h4{ font-size: 20px; font-weight: 100;line-height: 40px;}
.in-footer-text p{ font-size: 16px; font-weight: 100;line-height: 40px;}
.in-footer-x2{ }
.in-footer-coder{ position: relative; text-align:center;background: #04a07b url(../images/common-contact-attach.png) no-repeat 50% 100% / 100% auto;padding:44px 50px;}
.in-footer-coder:after{ content: ''; display: inline-block; position: absolute; left: 1px; top: 1px;}
.in-footer-coder .code .thumb{ text-align: center;}
.in-footer-coder .code .t{ text-align: center; font-size:16px; color: #fff; font-weight:100; padding-top:10px; margin-bottom:20px;}
.in-footer-coder .code .thumb img{ width: 100px; padding: 10px; background: #fff;}
.in-footer .addr{ text-align: left; padding: 10px 0; position: relative;}
.in-footer .addr h3{ line-height:56px;font-size:30px; color:rgba(255,255,255,.6);}
.in-footer .addr span{ font-size: 20px; padding-right: 10px;}
.in-footer .addr p{ line-height:30px; color:rgba(255,255,255,.6); font-size: 16px;}
.in-footer .addr p.btn-a a{ display: inline-block; border-radius: 20px; overflow: hidden; line-height: 35px; padding: 0 20px; background: #fff; color:#233975; font-size: 12px;}
.in-footer .name{ position: relative; width: 460px; float: left; text-align: left;padding-left: 120px;}
.in-footer .name:after{ content: ''; display: inline-block; left: 30px; top: 20px; bottom: 0;width: 1px; background: rgba(255,255,255,.2); position: absolute;}
.in-footer .addr:before{ content: ''; display: inline-block; right: 30px; top: 20px; bottom: 0;width: 1px; background: rgba(255,255,255,.2); position: absolute;}
.in-footer-text{ border-bottom:solid 1px rgba(0,0,0,.2);}
.in-footer .ico{ width: 55px; margin-top:5px;margin-right: 20px;border-right: solid 1px rgba(0,0,0,.1); float: left; /*padding: 20px 0;*/}
.in-footer .ico span{ font-size: 34px;color:rgba(0,0,0,.6); }
.in-footer .text{float: left;}
.in-footer .text h3{ color: #666; font-size: 24px; padding-bottom: 10px;}
.in-footer .text p{ line-height:24px;color:rgba(0,0,0,.6);}
.main-product{ width: 620px; margin: 0 10px 0 120px; text-align: center;}
.main-product img{ width: 80px;}
.main-product h3{ color:rgba(255,255,255,.6); font-weight: normal; font-size: 12px; text-align: center; line-height:18px; padding-top: 10px;}
.owl-buttons{ position:absolute; z-index:99999; height:32px; top:50%; margin-top: -32px; left:-80px; right:-80px; background-repeat: no-repeat;}
.owl-next{ position:absolute;  background-image:url(../images/owl-next.png) no-repeat center right !important ;top:0px; z-index:99999; right:0px !important; width:62px !important; height:62px !important; text-indent:-9999999px; background-size: 32px;}
.owl-prev{  position:absolute; background-image:url(../images/owl-prev.png) no-repeat  center left!important ;top:0px; z-index:99999; left:0px !important; width:62px !important; height:62px !important; text-indent:-9999999px;background-size: 32px;}
.footer{ padding:20px 0; background: #141414; line-height: 30px;}
.footer p{ text-align: center; color: #989898;}
.footer p a{ color:#989898; display: inline-block; padding: 0 15px;}
.in-coder{ position: relative;}
.in-coder .code{ width: 600px; text-align: center; position: absolute; left: 50%; top: 55px; margin-left: -300px;}
.in-coder .code img{ width: 160px; border: solid 10px #fff;}
.in-coder .code p{ line-height: 45px; color: #fff;}
.tit{ padding: 20px; text-align: center;}
.tit h5{font-size: 24px;line-height: 30px;color: #555;}
.tit p{font-size: 14px;color: #bbb;line-height: 26px;}
.page{ text-align: center;}
.about-info{ padding: 20px 0 50px;}
.about-info img{ float: left; margin: 0 30px 30px 0;}
.about-info-text{ line-height: 35px; font-size: 14px; color: #666;}
.trade-list li:hover .more { background: #03a083}
.product-desc .product-info ul{ padding: 20px 0 0 0;}
.product-desc .product-info li{ line-height: 35px; color: #666; margin-bottom: 0;}
.trade-info .job-title-ul span{ padding: 0 20px;}
.trade-info .thumb{ text-align: center; margin-top: 40px;}
.trade-info .thumb img{ padding: 5px; border: solid 1px #cfcfcf;}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus{
	 background:#03a083; border-color:#03a083;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus{
	color:#03a083;
}
.pagination > li > a, .pagination > li > span{ color:#666;}
@media (max-width:960px){
    body{ overflow-x: hidden;}
    .in-product li h3{white-space:nowrap;word-break:keep-all;overflow:hidden;text-overflow:ellipsis; }
    .in-about-contactus{position: static; width: 100%; margin-bottom: 20px; padding: 20px;}
    .in-join .in-join-title{ width: 100%; float: none;}
    .in-join .in-join-info{ width: 100%;float: none;}
    .main-product{ width:80%; margin: 0 10%;}
    .in-about,.in-product, .in-supply{ padding:40px 0;}
    .in-about-info{ padding: 30px;}
    .header-box{ padding: 0;}
    .header .tel{ display: none;}
    .banner .item a{ height: 120px;}
    .in-about-info{ padding: 30px;}
    .about-img{position: static; width: 100%;}
    .in-footer-code{ width:40%; margin: 0 5%; float: left;}
    .in-footer-code img{ width: 100%; padding: 5px;}
    .in-tit h4 a{ font-size: 26px;}
    .in-footer-item h3{ margin-bottom: 20px; font-size: 20px;}
    .in-footer-item .footer-item{ margin-left:50px; padding-left: 35px;}
    .in-footer-item .footer-item span{ font-size: 26px;}
    .banner{ margin-top: 0;}
    .header .logo{ padding: 0;}
    .header{ position: static;}
    .header .nav ul li.s a{ color: #fff !important;}
    .in-supplu-list .owl-buttons{ left: 0; right: 0;}
    .in-supply-box{ padding: 20px 10px;}
}