/*
Theme Name:zbuniversal
Theme URI: https://www.boke8.net/zbuniversal.html
*/
div,html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {margin:0; padding:0;}
body {background:#fff; font:100%/1.75em tahoma,Arial,'Microsoft Yahei'; overflow-x:hidden;}
a {text-decoration:none; color:#333; outline:none;}
a:hover {color:#E04D47;}
li {list-style:none;}
.clear {clear:both;}
a img {border:none;}
img {vertical-align: middle;}
table {background-color: transparent; border-spacing: 0; border-collapse: collapse; width:100%;border-top:solid 1px #e4e4e4;border-left:solid 1px #e4e4e4; box-sizing: border-box;}
table th{background-color:#f9f9f9;text-align:center; box-sizing: border-box;}
table td,table th{padding:1%;border:1px solid #e4e4e4; box-sizing: border-box;}
.inner {width:93.75%; max-width:1440px;  margin:0 auto;}
.thumbnail a {padding-bottom: 75%; position:relative; overflow: hidden; display: block;}
.thumbnail img {display: block; position:absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; transition: all .3s;}
.thumbnail a:hover img {transform: scale(1.1);}
/*header*/
.header {background-color:#fff; border-bottom:2px solid #E04D47; position:fixed; left:0; top:0; width:100%; z-index:9;}
.header .inner {position:relative; padding:20px 0; transition:padding 0.3s;}
.header.fixed .inner {padding: 10px 0;}
.blank {height:82px; transition:height 0.3s;}
.blank.fixed {height:62px;}


/*topbtn*/
.topbtn {float:right; padding:8px 0;}
/*language*/
.language {float:left; padding-left:8px;}
.language a {display:block; width:24px; height:24px; line-height: 23px; border-radius:50%; color:#fff; text-align:center; font-size: 14px;}
.language a:hover {color:#fff;}
/*searchBtn*/
.searchBtn {float:left; background:url(images/search.png) no-repeat center center; width:40px; height:24px; cursor:pointer;}
/*navbtn*/
.navbtn {position:relative; float:left; width:22px; height:24px; cursor:pointer; display: none;}
.navbtn:before, .navbtn:after {content:''; display: block; width:100%; height: 3px; background-color:#E04D47; position:absolute; left:0; border-radius:1.5px; transition:all .3s;}
.navbtn:before {top:3px;}
.navbtn:after {bottom:2.5px;}
.navbtn span {position:absolute; left:0; top:50%; margin-top:-1.5px; height: 3px; background-color:#E04D47; width:100%; border-radius:1.5px; transition:all 1s;}
.navbtn.open:before, .navbtn.open:after {top:50%; margin-top:-1px;}
.navbtn.open:before {transform: rotate(45deg);}
.navbtn.open:after {transform: rotate(-45deg);}
.navbtn.open span {opacity: 0; transition:all .3s;}
/*searchbox*/
.searchbox {display:none; position:absolute; right:0; top:100%; width:350px; margin-top:2px;}
.searchbox .box {overflow:hidden; padding:8px 42px 8px 8px; background-color:rgba(255,255,255,.8); border:1px solid #eee; position:relative;}
.searchbox .text {background-color:#fff; color: #333; height:24px; line-height:24px; padding:6px 5%; width:90%; border:none; font-size:14px;}
.searchbox .submit {position:absolute; right:8px; top:0; width:30px; height:100%; cursor:pointer; -webkit-appearance:none; background:url(images/search.png) no-repeat center center; border:none;}
/*logo*/
.logo {float:left;}
.logo a {display:block; width:160px; height:40px; background:no-repeat left center; background-size:contain; text-indent:-99999em;}
/*nav*/
.nav {margin-left:160px; margin-right:80px;}
.nav ul {float:right;}
.nav li {float:left; padding:4px 0; font-size:16px; line-height:32px; position:relative;}
.nav li em {display: none;}
.nav li a {display:block; padding:0 25px;}
.nav li .on, .nav li .cur {background-color:#E04D47; color:#fff; border-radius:3px;}
.nav li ul {position:absolute; left:0; top:100%; width:100%; background-color:#E04D47; border-radius:3px; padding:5px 0; display: none;}
.nav li ul:before {content:''; display: block; border-bottom:3px solid #E04D47; border-left:4px solid transparent; border-right: 4px solid transparent; position:absolute; bottom:100%; left:50%; margin-left:-4px;}
.nav li li {float:none; padding:0; line-height:1.875em; text-align: center;}
.nav li li a {padding:5px; color:#fff;}
/*bar*/
.bar {background-color:#F2F2F2; height:30px; border-bottom:1px solid #E4E4E4; line-height:30px; clear:both; font-size:14px; padding:5px 0;}
.bar .inner {overflow:hidden;}
/*notice*/
.notice {overflow: hidden; float:left; width:60%;}
.notice h3 {font-size:14px; font-weight:normal; background:url(images/arrow-right.png) no-repeat right center; padding-right:20px; float:left;}
.notice .box {margin-left:86px; overflow:hidden; position:relative; height:30px; }
.notice ul {position:relative; overflow:hidden;}
.notice li {height:30px;}
.notice li a {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.notice li a:hover {text-decoration:underline;}

/*breadcrumb*/
.breadcrumb {float:right; max-width:39%; color:#555; overflow: hidden;}
.breadcrumb .box {background:url(images/icon_home.png) no-repeat left center; padding-left:20px; white-space: nowrap; overflow:hidden; text-overflow: ellipsis;}
.breadcrumb a {color:#555;}

/*hmtitle*/
.hmtitle {overflow: hidden; margin-bottom: 5.5%; position:relative;}
.hmtitle h2 {display: inline-block; font-weight: normal; color:#fff; font-size:16px; line-height: 1.5em; padding:5px 20px; border-radius: 5px;}
.hmtitle span {position:absolute; right:0; top:50%; font-size:12px; height:24px; line-height: 24px; margin-top:-12px;}
.hmtitle a {color:#fff; padding:0 10px; border-radius:3px; display: block; }
.hmtitle a:hover {opacity: .85; color:#fff;}


/*service*/
#service {background-color:#fff;}
#service .inner {overflow: hidden;}
#service .hmtitle {margin-bottom: 1.5%;}
#service ul {overflow: hidden; width:105%;}
#service li {float:left; position:relative; width:20%; padding-right:5%; padding-top:3.5%;}
#service li .icon {width:40px; float:left;}
#service li .icon i {display: block; padding-bottom: 100%; background:no-repeat left center; background-size:cover;  border-radius:50%; overflow:hidden;}
#service li h3 {font-weight:normal; font-size:18px; line-height:1.35em; margin-left:55px;}
#service li h3:after {display: block; width:3em; height:3px; background-color: #dedede; content:''; margin-top:10px;}
#service li .intro {font-size:14px; line-height: 1.75em; color:#666; margin-top:15px; height: 5.25em; overflow:hidden; text-align: justify;}
#service li a {display: block; overflow:hidden; color:#000;}
/*about*/
#about {border-top:1px solid #ddd; border-bottom:1px solid #ddd; background-color:#F9F9F9;}
#about .box {display: table;  table-layout: fixed; width:100%;}
#about .pic {display: table-cell; vertical-align: top; width:43%;}
#about .pic a {display: block;}
#about .pic img {display:block; width:100%; height:auto;}
#about .intro {display: table-cell; vertical-align: middle; font-size:16px; line-height:1.875em; color:#333; text-align:justify; overflow:hidden; padding-left:3.5%;}
#about p {margin-bottom:15px;}
/*products*/
#products .inner {border-bottom:1px solid #e4e4e4;}
/*hmtab*/
.hmtab {margin-bottom: 3.5%;}
.hmtab ul {overflow: hidden;}
.hmtab li {float:left;padding-right:15px;}
.hmtab li span {display: block; color: #5C5C5C; padding:0 15px; background-color:#EEE;font-size:14px; border-radius:3px; cursor:pointer; line-height:35px; }
.hmtab li .on {color:#fff;}

/*hmpro*/
.hmpro {clear:both; overflow:hidden;}
.hmpro .box {display: none;}
.hmpro .on {display: block;}
.hmpro ul {overflow:hidden; width:102%; margin-bottom: 3.5%;}
.hmpro li {width:23%; float:left; padding:0 2% 2% 0;}
.hmpro li .thumbnail {overflow:hidden; margin-bottom: 10px;}
.hmpro li h2 {font-size:16px; line-height: 1.875em; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center;}
.hmpro li h2 a {color:#333;}
.hmpro .more {text-align: center;}
.hmpro .more a {display: inline-block; background-color: #eee; color:#555; border-radius: 5px; height:32px; line-height: 32px; padding:0 20px; font-size:14px;}
.hmpro .more a:hover {color:#fff;}

/*partner*/
.partner {float:right; width:540px; overflow:hidden;}
.partner .hmtitle {text-align: right;}
.partner ul {overflow:hidden; width:103%;}
.partner li {float:left; width:31%; padding:0 2% 2% 0;}
.partner li .item {border:1px solid #e4e4e4; padding:5px 15px;}
.partner li a {display:block; padding-bottom:62.5%; position:relative; overflow:hidden;}
.partner li img {position:absolute; left:0; top:0; width:100%; height:100%; display:block; filter:grayscale(100%); opacity:0.65;}
.partner li img:hover {opacity:0.8; filter:none;}
/*hmbox*/
.hmbox {padding:5% 0; overflow:hidden;}
/*newsbox*/
.newsbox {margin-right:590px; overflow:hidden;}
.hmnews ul {display: none;}
.hmnews ul.on {display: block;}
.hmnews li {font-size:16px; line-height: 1.875em; overflow:hidden; border-bottom:1px solid #eee; padding:8px 0;}
.hmnews li span {float:right; font-size:12px; color:#888;}
.hmnews li a {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:65px;}
.hmnews li i {font-style:normal; margin-right: 10px;}
/*newslist*/
.newslist ul {margin-bottom: 5%;}
.newslist li {font-size:16px; line-height: 1.875em; overflow:hidden; border-bottom:1px solid #eee; padding:8px 0;}
.newslist li span {float:right; font-size:12px; color:#888;}
.newslist li a {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:120px;}
.newslist li i {font-style:normal; margin-right: 10px;}

/*showcase*/
#showcase {background-color:#F9F9F9; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
#showcase .item img {transition:transform 0.5s ease-in 0s; }
#showcase .item a:hover img {transform:scale(1.3,1.3); opacity:0.8;}
#showcase .owl-nav button {display:block; position:absolute; top:50%; width:25px; transform:translateY(-50%);}
#showcase .owl-nav span {display: block; padding-bottom: 100%; text-indent:-99999em; font-size:0; line-height: normal; overflow: hidden; background:no-repeat center center;}
#showcase .owl-prev {left:0;}
#showcase .owl-prev span { background-image:url(images/arrow_left.png);}
#showcase .owl-next {right:0; }
#showcase .owl-next span {background-image:url(images/arrow_right.png);}
#showcase .owl-dots {font-size:0; line-height: normal; text-align: center;}
#showcase .owl-dot {display: inline-block; margin:0 5px;}
#showcase .owl-dot span {display: block; width: 6px; height: 6px; background-color: #999; border-radius: 50%;}
#showcase .active span {background-color: #E04D47;}
#showcase .load {padding-bottom: 18%;}
/*contact*/
#contact {background-color:#fff;}
#contact .hmtitle {text-align:center;}
#contact .info {width:45.83%; float:right;}
#contact .info h3 {font-weight:normal; font-size:18px; line-height: 1.5em; margin-bottom:20px;}
#contact .intro {font-size:14px; line-height: 1.75em; color:#555; margin-bottom:20px;}
#contact .info li {line-height:1.875em; font-size:16px; letter-spacing:1px; margin-bottom: 10px; position:relative; padding-left:30px;}
#contact .info li i {display:block; width: 20px; height: 20px; background-repeat:no-repeat; background-size:100% auto; position:absolute; left:0; top:5px;}
#contact .info li .addr {background-image: url(images/icon_addr.png);}
#contact .info li .phone {background-image: url(images/icon_phone.png);}
#contact .info li .mail {background-image: url(images/icon_mail.png);}


#contact .map {width:45.83%; float:left; overflow:hidden; position:relative;}
#contact #map {height:350px;}
#contact .map table {border:none;}
#contact .map th, #contact .map td {padding:0; border:none; box-sizing: content-box;}
#contact .map p {font-size:14px; padding:5px;}
#contact .pic img {display: block; width: 100%; height: auto;}
/*banner*/
#banner {width:100%; overflow:hidden; height:auto;}
#banner img {width:100%; height:auto; display:block;}

/*slides*/
.slides {position:relative; overflow:hidden;}
.slides .item a {display:block; padding-bottom:31.25%; position:relative; background:no-repeat center center; background-size:cover; overflow:hidden;}
.slides .load {padding-bottom:31.25%;}
.slides .owl-nav button{position:absolute; top:50%; transform:translateY(-50%); display:block; text-indent:-99999em;}
.slides .owl-nav span {display:block; width:38px; height:61px; background:url(images/arrow.gif) no-repeat 0 0; background-size:auto 100%; opacity:.5;}
.slides .owl-nav span:hover {opacity: 1;}
.slides .owl-prev {left:0;}
.slides .owl-next {right:0;}
.slides .owl-next span {background-position:100% 0;}
/*centerDots*/
.centerDots .owl-dots {position:absolute; left:50%; bottom:5%; transform:translateX(-50%); font-size:0; text-align:center; line-height: normal;}
.centerDots .owl-dot {display:inline-block; margin:0 5px;}
.centerDots .owl-dot span {display:block; width:8px; height:8px; background-color:rgba(255,255,255,.3); border:1px solid #fff; border-radius:50%;}
.centerDots .owl-dot.active span {background-color: #fff;}
/*container*/
#container {overflow:hidden; padding:30px 0;}
/*sidebar*/
.sidebar {float:left; width:250px;}
.sideMenu,.widget {margin-bottom:25px;}
.sideMenu h3 {font-weight:normal; color:#fff; padding:5px 20px; border-radius:4px 4px 0 0; font-size:0.875em; border-bottom:1px solid #000;}
.sideMenu a {color:#fff;}
.sideMenu ul li a {display:block; background:#222; border-bottom:1px solid #000; border-top:1px solid #333; padding:5px 20px; font-size:0.875em;}
.sideMenu ul li a:hover {background:#323232;}

.widget {overflow:hidden; border-top:2px solid transparent; font-size:14px; line-height: 1.75em;}
.widget h3 {font-size:16px; line-height: 1.875em; font-weight:normal; background-color:#eee; padding:5px 15px;}
.widget ul {border:1px solid #e4e4e4; border-top:none; padding:5px 15px;}
.widget li { border-bottom:1px solid #eee; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:5px 0;}
.widget li:last-child {border-bottom:none;}

.widget li a:hover {text-decoration:underline;}
.widget img {display:block; max-width:100%; height:auto;}

.widget .textwidget {border:1px solid #e4e4e4; border-top:none; overflow:hidden; padding:15px;}

#divTags ul {overflow: hidden;}
#divTags li{float:left;padding:1% 2% 1% 0; border:none;}
#divTags li a{display:block;background-color:#f9f9f9;border-radius:0px;padding:0 10px;color:#fff;font-size:12px;}
#divTags li span {display: none;}
#divTags li a:hover{opacity:.8; text-decoration: none;}
#divTags li:nth-child(8n-7) a{background-color:#8A9B0F;}
#divTags li:nth-child(8n-6) a{background-color:#EB6841;}
#divTags li:nth-child(8n-5) a{background-color:#3FB8AF;}
#divTags li:nth-child(8n-4) a{background-color:#FE4365;}
#divTags li:nth-child(8n-3) a{background-color:#FC9D9A;}
#divTags li:nth-child(8n-2) a{background-color:#EDC951;}
#divTags li:nth-child(8n-1) a{background-color:#C8C8A9;}
#divTags li:nth-child(8n) a{background-color:#83AF9B;}
#divTags li:first-child a{background-color:#E1474D;}
#divTags li:last-child a{background-color:#3299BB;}
/*divSearchPanel*/
#divSearchPanel form {position:relative; overflow:hidden; padding-right:40px;}
#divSearchPanel input[type="text"] {border:1px solid #eee; padding:5px 5%; width:90%; height:24px; line-height: 24px; color:#333; font-family: 'Microsoft Yahei';}
#divSearchPanel input[type="submit"] {position:absolute; top:0; right:0; display:block; width:40px; height:100%; border:none; background-color:#222; color:#fff; cursor:pointer;}

/*divCalendar*/
#divCalendar .textwidget {padding:0; border:none;}
#divCalendar table {text-align:center;}
#divCalendar caption {border:1px solid #e4e4e4; font-weight: normal; color:#555; font-size:16px; line-height: 1.875em; padding:5px 15px; border-bottom:none;}
#divCalendar td {font-size:14px; line-height: 1.875em; color:#666;}
#divCalendar td a {font-weight:bold; color:#f00;}

/*main*/
.main {margin-left:280px; overflow: hidden;}
/*pageTitle*/
.pageTitle {font-size:18px; line-height: 1.125em; font-weight:normal; margin-bottom:3%; border-bottom:1px solid #e4e4e4; padding-bottom: 10px;}
/*proList*/
.proList {overflow:hidden;}
.proList ul {width:102%; overflow:hidden;}
.proList li {float:left; width:31.33%; padding-right:2%; padding-bottom:2.5%; text-align:center;}
.proList li .thumbnail {margin-bottom:5px;}
.proList li h2 {font-size:16px; line-height: 1.875em; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
/*posttitle*/
.posttitle {font-weight:normal; font-size:26px; line-height: 1.5em; text-align:center; margin-bottom:2.5%;}
/*postmeta*/
.postmeta {text-align:center; font-size:0; line-height: normal; border-top:1px solid #e4e4e4; padding:2% 0;}
.postmeta span {display:inline-block; font-size:12px; line-height: 1.75em; color:#999; padding:0 5px;}
.postmeta a {color:#999;}
/*entry*/
.entry {font-size:16px; line-height: 1.875em; padding:2% 0; color:#333; overflow: hidden;}
.entry img {max-width:100%; height:auto!important;}
.entry p, 
.entry h1,
.entry h2,
.entry h3,
.entry h4,
.entry h5,
.entry h6 {margin-bottom: 2.5%;}
.entry blockquote {background-color:#f9f9f9; border:1px solid #e4e4e4; padding:2.5% 2.5% 0; overflow:hidden; margin:0 2em 2.5%;}
.entry ul,
.entry ol {padding-left:1em; margin-left:2em; margin-bottom:2.5%;}

.entry ul li {list-style:outside disc none;}
.entry ol li {list-style:outside decimal none;}

.entry hr {overflow:hidden; clear:both; border:none; border-bottom:1px solid #e4e4e4; margin-bottom:2.5%;}
.entry a {color:#E04D47;}
.entry a:hover {text-decoration:underline;}
/*tags*/
.tags {overflow:hidden;margin-bottom:3.5%;}
.tags h3 {float:left;font-size:14px;color:#555;line-height:1.75em;font-weight:normal;}
.tags ul {margin-left:42px;overflow:hidden;}
.tags li {float:left;font-size:14px;line-height:1.75em;padding:0 10px;}
.tags li a {text-decoration: underline;}
.tags li a:hover {text-decoration: none;}
/*postnavi*/
.postnavi {font-size:14px; line-height: 1.75em; border-top:1px solid #e4e4e4; padding:2% 0; margin-bottom: 2%;}
/*boxtitle*/
.boxtitle {font-weight:normal; font-size:18px; line-height: 1.35em; border-bottom:1px solid #e4e4e4; padding-bottom:2%; margin-bottom:2.5%; padding-left:15px; position:relative;}
.boxtitle:before {width: 5px; height: 10px; border-radius: 2.5px; background-color: #E04D47; content:''; display: block; position:absolute; left:0; top:8px;}
/*relatedPro*/
.relatedPro, .relatedPost {margin-bottom: 2.5%; overflow: hidden;}
.relatedPro ul {width: 102%; overflow: hidden;}
.relatedPro li {float:left; width: 23%; padding-right: 2%; padding-bottom: 2%;}
.relatedPro .thumbnail {overflow: hidden; margin-bottom: 5px;}
.relatedPro .thumbnail a {padding-bottom:75%; position:relative; overflow:hidden;}
.relatedPro .thumbnail img {display:block; width:100%; height:100%; position:absolute; left:0; top:0;}
.relatedPro h4 {font-weight: normal; font-size:14px; line-height: 1.5em; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; text-align: center;}

/*relatedPost*/
.relatedPost ul {overflow: hidden;}
.relatedPost li {font-size:16px; line-height: 1,875em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:5px;}
.relatedPost li i {margin-right:5px; font-style: normal;}
.relatedPost li a {color:#353535;}

/*commentslist*/
.commentslist {margin-bottom:20px;}
.commentslist ol li {clear:both; margin-top:20px; overflow:hidden; border-bottom:1px dotted #ccc; padding-bottom:10px;}
.commentslist ol li .cmtWrap {position:relative; padding-left:60px;}
.commentslist ol li .cmtWrap .gravatar {position:absolute; left:0; top:3px; width:45px; height:45px;}
.commentslist ol li .cmtWrap .gravatar img {width:100%; height:100%; border-radius:50%; transition:transform 0.4s ease 0s;}
.commentslist ol li .cmtWrap .gravatar img:hover {transform:rotateZ(360deg); transition:transform 0.4s ease 0s;}
.commentslist ol li .cmtWrap .cmtCont {font-size:0.875em; border:1px solid #eaeaea; background:#f5f5f5; padding:0 10px;}
.commentslist ol li .cmtWrap .cmtCont .cmtAuthor span {float:right; font-size:0.875em; color:#999;}
.commentslist ol li .cmtWrap .cmtCont .cmtDate {font-size:0.75em; color:#aaa; border-bottom:1px solid #eaeaea;}
.commentslist ol li .cmtWrap .cmtCont .cmtTxt {padding:10px 0;}
.commentslist ol li li {padding-left:20px; border-bottom:none;}
/*pagenavi*/
.pagenavi {clear:both; font-size:0; line-height: normal; text-align:center;}
.pagenavi a, .pagenavi span.now-page { font-size:14px; display:inline-block; padding:0px 11px; border:1px solid #e4e4e4; border-radius:3px; margin:3px; height:30px; line-height: 30px;}
.pagenavi a:hover, .pagenavi span.now-page {color:#fff; background-color:#E04D47; border:1px solid #E04D47; transition:all 0.4s ease 0s;}
/*respond*/
#comment {overflow: hidden}
#comment .item {overflow:hidden; margin-bottom: 2%; position:relative;}
#comment label {display: block; float:left; color:#555; background-color:#f9f9f9; border:1px solid #e4e4e4;  border-right:none; font-size:14px; width: 63px; padding:0 10px; height:44px; line-height: 44px;}
#comment label i {color: #f00; font-size:12px;	font-style: normal}
#comment .input {margin-left:84px; border:1px solid #E4E4E4; overflow:hidden;}
#comment .textarea {margin-left:0;}
#comment .verify {margin-right:139px;}
#comment .text {font-family:'Microsfot Yahei'; display:block; height: 24px; line-height: 24px; padding: 10px 2%; width: 96%; border:none; -webkit-appearance:none; font-size:14px; color:#333;}
#comment textarea.text {height:120px; resize: vertical;}
#comment .code {position:absolute; right:0; top:0; width: 138px; }
#comment .code img {display: block; cursor: pointer; width: 100%; height: auto;}
#comment .submit {display:block; border: 0; border-radius: 3px; width:120px; height:42px; color: #fff; font-size:16px; cursor: pointer; -webkit-appearance: none; float:right;}
#comment .submit:hover {opacity: .85;}
#comment .warning {font-size:14px; color:#666; line-height: 1.75em; margin-bottom:2%;}
/*footer*/
#footer {background-color:#F2F2F2; border-top:2px solid #eee;}
#footer .inner { padding:3.125% 0; display:table;}
#footer .line {border-top: 1px solid #D9D9D9;}
#footer .td {display: table-cell; vertical-align: middle;}
#footer .right {width: 400px; text-align: right;}
/*pageslist*/
.pageslist {padding:10px 0;}
.pageslist ul {overflow:hidden; font-size:0; line-height: normal;}
.pageslist li { font-size:16px; line-height:1.875em; padding-right:20px; display:inline-block;}
/*social*/
.social {clear:both; padding:10px 0;}
.social li {float:left; padding-right: 16px; position:relative;}
.social a {display:block; width:24px; height:24px; text-indent:-9999em; background:url(images/icon-sns.png) no-repeat; filter: grayscale(100%); opacity:0.65;}
.social .tq {background-position:0px -31px;}
.social .wx {background-position:0px -62px; position:relative; cursor:pointer;}
.social .qr {display:none; position:absolute; left:50%; bottom:100%; width: 110px; height: 110px; padding:5px; border:1px solid #e5e5e5; border-radius: 3px; background-color: #fff; margin-bottom:8px; margin-left:-66px;}
.social .qr img {display: block; width: 100%; height: 100%;}
.social .qr:after {content:''; display: block; width: 8px; height: 8px; background-color: #fff; border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; transform:rotate(45deg); position:absolute; left:50%; bottom:-6px; margin-left:-6px;}
.social .rr {background-position:0px -92px;}
.social .qz {background-position:0px -123px;}
.social .fb {background-position:0px -154px;}
.social .tw {background-position:0px -185px;}
.social .rss {background-position:0px -216px;}
.social a:hover {filter: grayscale(0); opacity:1;}
/*btmTel*/
.btmTel {color:#E04D47; font:italic bold 36px/40px 'Tahoma','Arial'; padding:10px 0; overflow: hidden;}
.btmTel a {float:right; display:block; position:relative; padding-left:55px; padding-right: 5px;}
.btmTel i {display: block; width: 40px; height: 40px; position:absolute; left:0; top:0;  background-image:url(images/icon_tel.png); background-repeat:no-repeat; background-size:100% auto;}
/*friendlinks*/
.friendlinks {padding:10px 0;}
.friendlinks li {font-size:14px; line-height: 1.875em; padding-right: 20px; color:#555; float:left;}
.friendlinks li a {color:#555;}
/*copyright*/
.copyright {font-size:14px; line-height: 1.875em; color:#666;}
.copyright p {padding:5px 0;}
.copyright a {display: inline-block; color:#666;}
.copyright img {display: inline-block; vertical-align: middle; width: auto; height: 20px; margin-top: -3px;}
/*backTop*/
#backTop {display: none;}
#backTop a {display:block; background-image:url(images/icon_back.png); background-repeat:no-repeat; background-position:center center; background-size:70%; width:32px; height:32px; position:fixed; right:5px; bottom:10%; z-index:9; border-radius:50%; text-indent:-99999em; overflow:hidden;}
#backTop a:hover {opacity: .85;}
/*error404*/
.error404 {background-color: #f9f9f9; padding:5%;}
.error404 .box {background-color:#fff; border-radius:15px; box-shadow: 0px 0px 10px #ddd; padding:10%; text-align: center;}
.error404 h1 {font-weight: normal; color:#333; line-height: 1.5em; font-size:48px; margin-bottom: 2.5%;}
.error404 p {font-size:16px; line-height: 1.875em; color:#555;}
.error404 a {color:#E04D47;}
/*screen width*/
@media only screen and (max-width:1536px){
    /*1536px*/
	.nav li a {padding:0 1.6276vw;}
}
@media only screen and (max-width:1280px){	
	
	/*1280*/
	.error404 {padding:10%;}
	.error404 h1 {font-size:32px;}
    /*1280*/
    .nav li a {padding:0 1.45vw;}
}
@media only screen and (max-width:1024px){
    /*1024px*/
	.header .inner {padding:15px 0; position: static;}
    .logo a {width:140px; height: 35px;}
	.blank {height: 65px;}
    .blank.fixed {height: 57px;}
	.topbtn {padding:5.5px 0;}
	.navbtn {display: block;}
	.language {padding-right: 16px;}
	/*1024px*/
	.navbar {margin:0; position:fixed; height:100%; background-color:#E04D47; width:100%; left:-100%; top:67px; overflow-y:auto; -webkit-overflow-scrolling:touch; transition:left .3s;}
	.navbar.open {left:0;}
	.navbar ul {float:none; border-top:1px solid #bbb; border-bottom:1px solid #ED4646;}
	.navbar li {float:none; padding:0; border-bottom:1px solid #d04D47; border-top:1px solid #ED4646; line-height: 32px;}	
	.navbar li em {display: block; position:absolute; right:0; top:0; padding-right:3.125%; width:42px; height:42px; z-index: 1;}
	.navbar li em:before {content:''; display: block; width:8px; height: 8px; border-right:1px solid #eee; border-bottom: 1px solid #eee; transform:rotate(45deg); position: absolute; left:50%; top:50%; margin: -6px 0 0 -6px; cursor: pointer;}
	.navbar li a {color:#fff; padding:5px 3.125%;}	
	.navbar li ul {position:static; left:auto; top:auto; background-color:transparent; border:none; padding:0; border-top:1px solid #d04D47;}
	.navbar li ul:before {display: none;}
	.navbar li li {text-align:left; border-bottom:1px solid #d04D47; border-top:1px solid #ED4646;}
	.navbar li li a{text-indent:2em;}

    .fixed .navbar {top:57px;}
	/*1024px*/
	.partner {float:none; width:auto; margin-bottom:5.5%;}
	.partner .hmtitle {text-align: center;}
	.partner li {width:14.5%;}
	/*1024px*/
	.newsbox {margin-right: 0;}
	
    
	/*1024px*/
	.posttitle {font-size:22px;}
	/*1024px*/
	.sidebar {width: 220px;}
	/*1024px*/
	.main {margin-left:250px;}
	/*1024px*/
	.error404 {padding:15%;}
	.error404 h1 {font-size:26px;}
}
@media only screen and (max-width:960px){
	
	
	/*navdot*/
	.navdot {display:none; clear:both; margin:0; position:absolute; left:0; top:100%; z-index: 9; background-color: #E04D47; border-bottom: 1px solid #ED4646; width: 100%;}
	.navdot.open {display: block;}
	.navdot ul {overflow: hidden; float:none;}
	.navdot li {width:33.33%; font-size:14px; padding:0; text-align: center;border-bottom:1px solid #d04D47; border-top:1px solid #ED4646;}
	.navdot li a {padding:0; color:#fff;}
	/*960px*/
	#about .intro {font-size:14px; line-height: 1.75em;}
	/*960px*/
	#footer .inner {display: block; padding:5% 0;}
	#footer .td {display: block; clear:both;}
	#footer .right {width: auto; text-align: center;}
	/*960px*/
	.copyright p {padding:0;}
	/*960px*/
	.btmTel {text-align: center; font-size: 24px; line-height: 30px;}
	.btmTel a {float:none; display: inline-block; padding-left:40px; font-style: normal;}
	.btmTel i {width: 30px; height: 30px;}
	/*960px*/
	.pageslist {padding:5px 0; text-align: center;}
	.pageslist li {padding:0 8px; font-size:14px;}
	.social, .friendlinks {padding:5px 0;}
	.social ul, .friendlinks ul {font-size:0; line-height: normal; text-align: center;}
	.social li, .friendlinks li {display:inline-block; float:none; padding:0 8px;}
	/*960px*/
	#contact .info, #contact .map {width: 47%;}
	/*960px*/
	.sidebar {width: 200px;}
	/*960px*/
	.main {margin-left:230px;}
}


@media only screen and (max-width:768px){
	/*768px*/
	.header .inner, .header.fixed .inner {padding:12.5px 0;}	
	.logo a {width:120px; height: 30px;}
	.topbtn {padding:3px 0;}
	.blank {height: 57px;}
	.nav {top:57px;}
	.searchbox {width:100%;}
	.searchbox .box {padding:6px 36px 6px 6px;}
	.searchbox .submit {width:36px; right:0;}
	/*768px slides*/
	.slides .owl-nav span {width:20px; height:32px;}
	.slides .owl-dots {bottom:10%;}
	/*768px centerDots*/
	.centerDots .owl-dot {margin:0 3px;}
	.centerDots .owl-dot span {width:8px; height:8px;}
	/*768px bar*/
	.bar {font-size: 12px; padding:2px 0;}
	.notice h3 {padding-right: 15px;}
	.notice .box {margin-left:81px;}
	/*768px hmbox*/
	.hmbox {padding:7.5% 0;}
	/*768px hmtitle*/
	.hmtitle {text-align: center;}
	.hmtitle h2 {font-size:14px; padding:5px 10px; line-height: 1.25em; border-radius: 3px;}
	/*768px service*/
	#service .hmtitle {margin-bottom: 3.5%;}
	#service ul {width: 110%;}
	#service li {width: 40%; padding-right: 10%; text-align: center;}
	#service li .icon {float:none; width: 80px; margin:0 auto 10px;}
	#service li h3 {margin-left:0; font-size:16px;}
	#service li h3:after {width: 2em; height: 2px; margin:10px auto 0;}
	#service li .intro {text-align: center; margin-top:10px; height: 3.5em;}
	/*768px aboutus*/
	#about .hmtitle {text-align:left;}
	#about .box {display: block;}
	#about .pic {display: block; width: auto; margin-bottom: 2.5%;}
	#about .intro {display: block; padding-left:0;}
	#about p {margin-bottom: 2%;}
	/*768px partner*/
	.partner li {width:31%;}
	/*768px copyright*/
	.copyright {font-size:12px;}
	/*768px hmtab*/
	.hmtab {margin-bottom: 5.5%;}
	.hmtab ul {font-size:0; line-height: normal; text-align: center;}
	.hmtab li {display:inline-block;  float:none; padding: 2px 5px;}
	.hmtab li span {line-height: 1.25em; padding:5px 10px;}
	/*768px hmpro*/
	.hmpro ul {margin-bottom: 3%;}
	.hmpro li {width: 48%;}
	.hmpro li .thumbnail {margin-bottom: 5px;}
	.hmpro li h2 {font-size:14px;}	
	.hmpro .more a {font-size:12px; line-height: 26px; height:26px; padding:0 15px;}
	/*768px*/
	#contact .intro {margin-bottom: 10px;}
	#contact .info, #contact .map {width: auto; float:none;}
	#contact .info {margin-bottom: 5%;}
	#contact .info h3 {font-size:16px; margin-bottom: 10px;}
	#contact .info li {font-size:14px; line-height: 1.75em; margin-bottom: 5px; padding-left:20px;}
	#contact .info li i {width: 14px; height: 14px; top:5.25px;}
	#contact #map {height: 300px;}
	/*768px*/
	.newsbox .hmtab {margin-bottom: 3.5%;}
	/*768px*/
	.hmnews li {font-size:14px; line-height: 1.75em; padding:6px 0;}
	.hmnews li i {margin-right: 5px;}
	/*768px*/
	#showcase .owl-dots {margin-top:5.5%;}
	/*768px*/
	.posttitle {font-size:18px;}
	/*768px*/
	.entry {font-size:14px; line-height: 1.75em;}
	/*768px*/
	.boxtitle {font-size:16px; padding-left:10px;}
	.boxtitle:before {width: 3px; border-radius: 1.5px; top:5.8px;}
	/*768px*/
	.relatedPro li {width: 48%;}
	/*768px*/
	.sidebar {display: none;}
	/*768px*/
	.main {margin-left:0;}
	/*768px*/
	#container {padding:7% 0;}
	/*768px*/
	.pageTitle {margin-bottom: 5%; font-size:16px;}
	/*768px*/
	.proList ul {overflow:hidden;}
	.proList li {width:48%;}
	.proList li h2 {font-size:14px;}
	/*768px*/
	.pagenavi a, .pagenavi span.now-page {font-size:12px; line-height: 24px; height:24px; padding:0 7px;}
	/*768px*/
	.newslist ul {margin-bottom: 7%;}
	.newslist li {font-size:14px; line-height: 1.75em; padding:6px 0;}
	.newslist li i {margin-right: 5px;}
	/*768px*/
	.social li, .friendlinks li {padding:0 5px;}
	/*768px*/
	.error404 {padding:30% 5%;}
	.error404 .box {padding:25% 10%;}
	.error404 h1 {font-size:18px; margin-bottom: 5%;}
	.error404 p {font-size:14px;}
	/*768px*/
	.relatedPost li {font-size:14px; line-height: 1.75em;}
	/*768px*/
	.newslist li span {float: none;}
	.newslist li a {margin-right: 0;}
}



/*border color*/
.bdColor {border-color:#E04D47;}
/*background color*/
.bgColor {background-color: #E04D47;}
/*font color*/
.ftColor {color:#E04D47;}
/*backgroun image*/
.bgImage {background-position: 0 0;}
/*background hover*/
.bgHover a:hover {background-color: #E04D47;}
/*background on*/
.bgCur .on {background-color: #E04D47;}