@charset "UTF-8";
@font-face {
    font-family: 'barlow-condensed-v4-latin-500';
    src: url('../fonts/barlow/barlow-condensed-v4-latin-500.eot');
    src: local('☺'), url('../fonts/barlow/barlow-condensed-v4-latin-500.woff') format('woff'), url('../fonts/barlow/barlow-condensed-v4-latin-500.ttf') format('truetype'), url('../font/barlow/barlow-condensed-v4-latin-500.svg') format('svg');
    font-weight: normal;
    font-style: normal
}
@font-face {
    font-family: 'barlow-condensed-v4-latin-200';
    src: url('../fonts/barlow/barlow-condensed-v4-latin-200.eot');
    src: local('☺'), url('../fonts/barlow/barlow-condensed-v4-latin-200.woff') format('woff'), url('../fonts/barlow/barlow-condensed-v4-latin-200.ttf') format('truetype'), url('../font/barlow/barlow-condensed-v4-latin-200.svg') format('svg');
    font-weight: normal;
    font-style: normal
}
*{margin:0;padding:0;border:0;font-size:100%;font:inherit;box-sizing:border-box}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{font-size: 17px;font-family:"Microsoft JhengHei","Microsoft YaHei", Helvetica, Arial,Tahoma,sans-serif}
h1, h2, h3, h4, h5, h6{font-family:"Microsoft JhengHei","Microsoft YaHei", Helvetica, Arial,Tahoma,sans-serif}
svg:not(:root){overflow:hidden}
hr{-moz-box-sizing:content-box;box-sizing:content-box;max-width: 100%;border-bottom: 1px solid #e9e9e9;}
a{color:#222222;background-color:transparent;text-decoration:none;-webkit-transition:all 0.3s ease-out 0s;-moz-transition:all 0.3s ease-out 0s;-ms-transition:all 0.3s ease-out 0s;-o-transition:all 0.3s ease-out 0s;transition:all 0.3s ease-out 0s}
a:active,a:hover{outline:0;text-decoration:none;color:#0056f9 !important}
input{box-shadow:none !important}
button{border:none}
section{padding:3.75rem 0}
.small{font-size:80%;text-transform:uppercase;color:#c6c6c6}
.image {display: block;overflow: hidden;}
.grid-container{max-width:100rem}
.BarlowFont500{font-family:"barlow-condensed-v4-latin-500"}
.BarlowFont200{font-family:"barlow-condensed-v4-latin-200"}
.color-default{color: #222222}
.color-primary{color:#0056f9}
.color-secondary{color:#ff3838}
.color-gray{color: #888888}
.color-white{color:#fff !important}
.bg-white{background: #fff}
.bg-gray{background:#f4f7fe}
.bg-primary{background: #0056f9}
.bg-secondary{background: #ff3838;color: #fff}
.border-left{border-left:1px solid #e5e5e5}
.border-bottom{border-bottom: 1px solid #e8eef9;}
.mb20{margin-bottom:20px}
.mb30{margin-bottom:30px}
.mb40{margin-bottom:40px}
.mb50{margin-bottom:50px}
i.fa-phone{transform: rotate(90deg)}
/* 图片遮罩层 */
.overlay{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background:rgba(255,255,255,0.5);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;opacity:0;-webkit-transition:.4s;-o-transition:.4s;transition:.4s}
.overlay a,.overlay span{text-align:center;font-family:auto;width:60px;height:60px;line-height:60px;background:#0056f9;color:#fff;border-radius:50%;font-size:20px;margin-top:100px}
.overlay a:hover,.overlay span:hover{background:#ff3838;color:#fff !important}
/* 栏目大标题 */
.main-title{margin-bottom:50px}
.main-title h2{font-weight:600;position:relative}
.main-title span{position:relative;color:#7a7a7a}
.main-title span:before,.main-title span:after{display:inline-block;content:"";width:30px;height:1px;background-color:#ff3838;vertical-align:middle}
.main-title span:before{margin-right:15px}
.main-title span:after{margin-left:15px}
/* 隔栏横线 */
.type-sidelines{display:block;text-align:center;overflow:hidden;white-space:nowrap}
.type-sidelines span{display:inline-block;position:relative;padding-left:0.5em;padding-right:0.5em}
.type-sidelines span:before,.type-sidelines span:after{content:'';position:absolute;height:100%;width:9999px;top:50%;border-top-style:solid;border-top-width:1px}
.type-sidelines span:before{right:100%}
.type-sidelines span:after{left:100%}
/* 标签 */
.tags{align-items:center;display:flex;flex-wrap:wrap;justify-content:flex-start}
.tag:not(body){align-items:center;border-radius:4px;color:#4a4a4a;display:inline-flex;font-size:.75rem;height:2em;justify-content:center;line-height:1.5;padding-left:0.75em;padding-right:0.75em;white-space:nowrap}
.tags .tag{margin-bottom:0.5rem}
.tags .tag:not(:last-child){margin-right:0.5rem}
.tags.has-addons .tag:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.tags.has-addons .tag{margin-right:0}
.tags.has-addons .tag:not(:first-child){margin-left:0;border-top-left-radius:0;border-bottom-left-radius:0}
/* 产品详细按钮 */
a.btn-slide{position:absolute;display:flex;overflow:hidden;font-size:0;right:0;bottom:24px}
a.btn-slide span{padding-right:0 !important;right:-90%;z-index:2 !important}
a.btn-slide i,a.btn-slide span{position:relative;height:40px;padding:0 15px;display:inline-flex;align-items:center;font-size:16px;color:#fff;background:#0056f9;border-radius:35px 0 0 35px;transition:.5s;z-index:1}
.isotope_item:hover a.btn-slide i{background:#ff3838;border-radius:0}
.isotope_item:hover a.btn-slide span{background:#ff3838;right:0}
/* 默认按钮 */
.btn-primary{background:#ff3838 none repeat scroll 0 0;border:none;border-radius:4px;color:#fff !important;cursor:pointer;display:inline-block;font-size:16px;font-weight:800;letter-spacing:0;line-height:1.4;margin-bottom:0;padding:14px 22px;text-align:center;text-transform:inherit;touch-action:manipulation;transition:all ease 700ms;-moz-transition:all ease 700ms;-webkit-transition:all ease 700ms;-ms-transition:all ease 700ms;-o-transition:all ease 700ms;vertical-align:middle;white-space:nowrap;position:relative;overflow:hidden;z-index:1}
.btn-primary i{margin-left:5px}
.btn-primary:hover{color:#fff !important;box-shadow:none}
.btn-primary span{background:#0056f9 none repeat scroll 0 0;border-radius:50%;display:block;height:0;position:absolute;transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transition:width 0.6s ease 0s,height 0.6s ease 0s;-moz-transition:width 0.6s ease 0s,height 0.6s ease 0s;-webkit-transition:width 0.6s ease 0s,height 0.6s ease 0s;-ms-transition:width 0.6s ease 0s,height 0.6s ease 0s;-o-transition:width 0.6s ease 0s,height 0.6s ease 0s;width:0;z-index:-1}
.btn-primary:hover > span{height:262.5px;width:262.5px}
/* 响应式 */
/* min-width */
@media all and (min-width:1620px) {
    .call-to-wrap{margin-left:320px}
}

@media all and (min-width:1440px) {
    .sidebarL{padding-right:60px}
    .site-footer .footer-pro{padding-right:30px;}
    .sidebarR .list-post-x .thumbnail{width: 140px}
    .Product-tj .list-post-x .thumbnail{width: 100%;}
}

@media all and (min-width:1216px) {

    .ab-pic.aboutImg,.wh-pic{float: right;}
}

@media all and (min-width:1024px) {
    .blog-post{padding-right: 1rem;}
}

@media all and (min-width:769px) {}

@media all and (min-width:641px) {}

@media all and (min-width:577px) {}

@media all and (min-width:481px) {}

/* max-width */
@media all and (max-width:1619px) {
    .about-area .about-content .aboutImg::after {
        display: none;
    }

    .about-area .about-content .aboutText span.engTxt {
        font-size: 34px;
    }

}

@media all and (max-width:1439px) {
    .header-nav .site-branding .brand-logo img {
        height: 50px;
    }

    .header-nav .brand-info h5 {
        font-size: 16px;
    }

    .header-nav .brand-info p {
        font-size: 14px;
    }

    .header-nav .main-menu ul li>a {
        padding: 35px 5px;
        font-size: 15px;
    }

    .header-nav .top-phone li {
        font-size: 14px;
    }

    .header-nav .top-phone i {
        font-size: 34px;
    }

    .header-nav .top-phone li .phoneNum {
        font-size: 28px;
    }

    .service-area .inner h5 {
        font-size: 17px;
    }

    .service-area .inner p {
        font-size: 80%;
    }

    .about-area .about-content .aboutText span.engTxt {
        font-size: 28px;
    }

    .sidebarL {
        padding-right: 30px;
    }
    .news-list .card-section .article-title{
        font-size: 1.3rem;
    }
    .news-list  .card-section .article-desc{
        font-size: 15px;
        line-height:1.5em;
    }
    .sidebarR .list-post-x .thumbnail{width: 140px}
    .Product-tj .list-post-x .thumbnail{width: 100%;}
}

@media all and (max-width:1280px) {
    .header-nav .top-phone li .phoneNum {
        font-size: 24px;
    }

    .service-area .inner h5 {
        font-size: 16px;
        letter-spacing: -1px;
    }

    .about-area .about-content {
        padding: 3rem;
    }

    .about-area .about-content .aboutText span.engTxt {
        font-size: 26px;
    }
    .footer-bottom a {
        padding: 0.5rem;
    }
    .sidebarL .sidebar-widget .h2{font-size: 2rem;}
    .news-list .card-section .article-title{
        font-size: 1.2rem;
    }
    .sidebarR .list-post-x .thumbnail{width: 100px}
    .Product-tj .list-post-x .thumbnail{width: 100%;}
    
}

@media all and (max-width:1215px) {
    .sidebarL {
        padding: 0
    }

    .sidebarR .list-post-x .thumbnail {
        width: 80px;
    }
    .Product-tj .list-post-x .thumbnail{width: 100%;}
    .list-post-x h5 {
        font-size: 18px;
    }

    .list-post-x p {
        font-size: 12px;
    }

    .main-banner {
        padding-top: 200px;
        padding-bottom: 200px;
    }
    .ab-pic.aboutImg{
        text-align: center;
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 30px;
        
    }
    .ab-pic.aboutImg img{
        border-radius: 5px;
    }
    .ab-pic.aboutImg::after,.wh-pic{
        display: none;
    }
}

@media all and (max-width:1200px) {
    .header-nav {
        padding: 15px 0
    }

    .header-nav .brand-info {
        display: none
    }

    .header-nav .top-phone .icon-text {
        display: none
    }

    .header-nav.breakpoint-on .nav-menu .site-branding {
        display: block !important;
        margin-bottom: 1.75rem
    }

    .app-area .app-slider .single-box .part-txt h5 a {
        font-size: 22px;
    }
}

@media all and (max-width:1176px) {
    .work-area .work-card {
        padding: 20px 0;
    }

    .work-area .work-card i.Num {
        font-size: 20px;
    }

    .work-card::after {
        left: -150px;
    }

    .service-area .inner {
        padding: 8px;
    }

    .service-area .inner h5 {
        font-size: 15px;
        letter-spacing: -2px;
    }

    .about-area .about-content .aboutText span.engTxt {
        font-size: 24px;
    }
    .news-list.hoverBox{padding: 1.7em 1.2em;}
    .news-list .card-section .article-title{
        font-size: 1.1rem;
    }
    .product-details-title h1 {
        font-size: 32px;
        padding-bottom: 10px;
        margin-bottom: 10px;
     }
     .product-details-content p{
        margin-bottom: 8px;
        font-size: 16px;
     }
}

@media all and (max-width:1023px) {
    .header-nav.breakpoint-on .nav-menu .nav-search{display:block !important}
    .list-post-x p{font-size:14px}
    .main-banner{padding-top:160px;padding-bottom:160px}
    .search-content .search-warp{margin:0 auto}
    .search-content .search-warp li input[type="search"]{width:250px}
    .work-area .grid-x{margin-left:auto;margin-right:auto}
    .work-area .work-card img{padding:0 40px}
    .work-area .work-card p{font-size:14px}
    .service-area .inner h5{font-size:20px}
    .service-area .inner p{font-size:100%}
    .isotope_item{text-align:center}
    .isotope_item h5{margin:10px 0 0;font-size:16px}
    .isotope_item p{font-size:14px}
    .about-area .about-content .aboutText span.engTxt{font-size:28px}
    .about-area .about-content .aboutText h2{font-size:1.5rem}
    .card-article-hover .card-section{margin-bottom:25px}
    .news_righ_item img{max-height:300px;height:auto;margin-bottom:25px}
    .call-to-wrap{text-align:center}
    .call-to-action .call-to-wrap .call-text{float:none}
    .call-to-action .call-to-wrap h3{font-size:26px}
    .call-to-action .call-to-wrap .phoneNum{font-size:26px}
    .call-to-action .call-to-wrap .call-text .menu{justify-content:center}
    .call-to-action .call-to-wrap .btn-primary i{display:inline-block}
    .footer-bottom{text-align:center}
    .footer-bottom .footer-bottom-links{-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}
    .inner-lxBox{margin-top:40px;padding:40px 30px 20px}
    .message-wrap h2{font-size:24px}
    .news-list .card-section{margin-top:30px}
    .news-list.hoverBox{padding:2em 1.5em}
    .product-details{margin-top:0}
}

@media all and (max-width:768px) {
    .main-title h2 {
        font-size: 38px;
    }

    .main-title span {
        font-size: 16px;
    }

    .why_wrap .choose-info {
        width: 100% !important;
        padding: 8px 10px;
    }

    .why_wrap .choose-info strong {
        font-size: 1.6rem;
    }

    .work-area .work-card img {
        padding: 0 30px;
    }

    .work-area .work-card p {
        font-size: 14px;
    }

    .service-area .inner h5 {
        font-size: 18px;
    }

    .about-area .about-content .aboutText p {
        font-size: 16px;
    }

    .card-wh-box-info {
        font-size: 16px;
    }

    .app-area .app-slider .single-box .part-txt h5 a {
        font-size: 20px;
    }
    .app-area .tabs li a{
        font-size: 15px;
        padding: 10px;
        width: 145px;
    }
    .card-section .article-desc{
        font-size: 16px;
    }
    .app-area .app-to-action h3{
        font-size: 24px;
    }
    .product-details-title h1 {
        font-size: 28px;
        padding-bottom: 5px;
        margin-bottom: 5px;
     }
     .product-details-content p{
        margin-bottom: 5px;
        font-size: 15px;
     }
}

@media all and (max-width:640px) {
    .main-title h2 {
        font-size: 32px;
    }

    .main-title span {
        font-size: 14px;
    }

    .work-area .work-card img {
        padding: 0 50px;
    }

    .work-area .work-card p {
        font-size: 15px;
    }

    .products-area .tabs {
        margin-bottom: 1rem;
    }

    .products-area .tabs li.tabs-title>a {
        font-size: 14px;
        padding: 10px 15px;
    }

    .about-area .about-content .aboutImg {
        padding: 0 0 30px;
    }

    .gcpic-area .tabs {
        top: -46px;
    }

    .gcpic-area .tabs li.tabs-title>a {
        padding: 14px 18px;
    }

    .app-area .app-slider .single-box .part-txt h5 a {
        font-size: 18px;
    }
    ul.pglist li .disabled,ul.pglist li a{
        padding: 1rem 1.25rem;
    }
    .app-area .app-to-action h3{
        font-size: 22px;
    }
    .product-details .slick-arrow {
        background: none;
        color:#3a4953;
        font-size: 26px;
     }
     .product-details .slick-arrow:hover {
        background: none;   
     }
    .product-details .slick-arrow.prev {
        left: 0px
     }
     
     .product-details .slick-arrow.next {
        right: 0px
     }
     .product-details-content p{
        margin-bottom: 5px;
        font-size: 16px;
     }
}

@media all and (max-width:576px) {
    .main-banner {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .main-title h2 {
        font-size: 26px;
    }

    .type-sidelines span {
        font-size: 28px;
    }

    .call-to-action::before {
        background-color: rgba(18, 203, 196, 0.9);
    }

    .call-to-action::after {
        display: block;
        left: 0;
    }

    .call-to-action .call-to-wrap h3 {
        font-size: 22px;
    }

    .call-to-action .call-to-wrap .phoneNum {
        font-size: 26px;
    }
    .site-footer {
        font-size: 14px;
    }
    .footer-bottom {
        font-size: 14px;
    }
    .app-area .app-to-action h3{
        font-size: 20px;
    } 
}

@media all and (max-width:480px) {
    .main-title h2 {
        font-size: 22px;
    }

    .main-title span {
        font-size: 12px;
    }

    .header-nav .site-branding .brand-logo img {
        height: 42px;
    }

    .service-area .inner h5 {
        font-size: 16px;
    }

    .service-area .inner p {
        font-size: 80%;
    }

    .products-area .tabs li.tabs-title>a {
        padding: 10px 5px;
    }

    .about-area .about-content {
        padding: 2rem;
    }

    .about-area .wenhua-wrap {
        margin-top: 20px;
    }

    .gcpic-area .tabs {
        top: -36px;
    }

    .gcpic-area .tabs li.tabs-title>a {
        font-size: 16px;
        padding: 10px;
    }

    .folio-hvr-title h5 {
        font-size: 16px;
    }

    .call-to-wrap {
        text-align: left;
    }

    .call-to-action .call-to-wrap .call-text .menu {
        justify-content: left;
    }

    .call-to-action .call-to-wrap p {
        font-size: 12px;
    }
    
    .footer-bottom a {
        padding: 0.2rem;
    }
    .ab-title{
        font-size:22px;
    }
    .app-area .app-to-action{
        padding: 1rem 1rem 0;
    }
}