.header{ height: 80px; display: flex; justify-content: space-between; align-items: center;}
.header>.logo{ display: block; position: relative; padding: 0 20px 0 58px; margin: 0 0 0 10px; line-height: 48px; font-size: 16px; color: #000; font-weight: 600; text-decoration: none;}
.header>.logo::before{ position: absolute; content: ''; width: 48px; height: 48px; background: url('../img/logo.png'); background-position: 50% 50% !important; background-size: cover !important; left: 0;}
.header>.r-part{ flex: 1; display: flex; justify-content: flex-end; align-items: center;}
.header>.r-part>.pc-nav{ padding: 0 15px 0 0;}
.pc-nav>ul.box{ margin: 0; padding: 0;}
.pc-nav>ul.box>li{ list-style: none; margin: 0; padding: 0 5px; line-height: 80px; float: left; font-weight: 600; font-size: 14px;}
.pc-nav>ul.box>li>a{ color: #000; text-decoration: none;}
.pc-nav>ul.box>li>a:hover{ color: #A7000D;}
.pc-nav>ul.box>li.hov{ position: relative;}
.pc-nav>ul.box>li.hov>a{ color: #A7000D;}
.pc-nav>ul.box>li.hov::after{ position: absolute; content: ''; left: 0; right: 0; bottom: 0; height: 3px; background: #A7000D;}

.pc-tel .box{ background: #A7000D; height: 36px; line-height: 36px; padding: 0 10px; color: #FFF; display: flex; justify-content: center; align-items: center; border-radius: 36px; -webkit-border-radius: 36px; -moz-border-radius: 36px; -ms-border-radius: 36px; -o-border-radius: 36px; }
.pc-tel .box>.ico{ width: 24px; height: 24px; margin: 0 10px 0 0;}
.pc-tel .box>.tel{ font-size: 14px; font-weight: 600;}

.mb-bar>.box{ width: 28px; height: 28px; margin: 0 10px 0 0;}
.mb-bar>.box>.link{ width: 28px; height: 28px; cursor: pointer; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative;}
.mb-bar>.box>.link>.m{ width: 28px; height: 4px; background: #A7000D;}
.mb-bar>.box>.link::before{ position: absolute; content: ''; width: 28px; height: 4px; background: #A7000D; top: 0; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease;}
.mb-bar>.box>.link::after{ position: absolute; content: ''; width: 28px; height: 4px; background: #A7000D; bottom: 0; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease;}
.mb-bar>.box>.link-hov>.m{ display: none;}
.mb-bar>.box>.link-hov::before{ left: 14px; background: #C00; transform: rotate(135deg) translate(16px, 0); -webkit-transform: rotate(135deg) translate(16px, 0); -moz-transform: rotate(135deg) translate(16px, 0); -ms-transform: rotate(135deg) translate(16px, 0); -o-transform: rotate(135deg) translate(16px, 0); }
.mb-bar>.box>.link-hov::after{ left: 14px; background: #C00; transform: rotate(-135deg) translate(16px, 0); -webkit-transform: rotate(-135deg) translate(16px, 0); -moz-transform: rotate(-135deg) translate(16px, 0); -ms-transform: rotate(-135deg) translate(16px, 0); -o-transform: rotate(-135deg) translate(16px, 0); }

.mb-nav{ position: absolute; top: 80px; right: 0;}
.mb-nav>ul.box{ margin: 0; padding: 0; background: #A7000D;}
.mb-nav>ul.box>li{ list-style: none; margin: 0; line-height: 35px;}
.mb-nav>ul.box>li>a{ padding: 0 15px; line-height: 35px; display: block; font-size: 14px; color: #FFF; text-decoration: none;}
.mb-nav>ul.box>li.hov>a{ background: rgba(0, 0, 0, 0.6);}


.comm-name{ position: relative; padding: 0 0 10px;}
.comm-name>.cn{ color: #A7000D; height: 48px; line-height: 48px; font-size: 30px; font-weight: 600;}
.comm-name>.en{ color: #808080; height: 30px; line-height: 30px; font-size: 16px; font-family: '阿里妈妈灵动体 VF Thin'; text-transform: capitalize;}
.comm-name::before{ position: absolute; content: ''; left: 0; right: 0; bottom: 0; height: 1px; background: #D8D8D8;}
.comm-name::after{ position: absolute; content: ''; left: 50%; bottom: -5px; width: 11px; height: 11px; background: #A7000D; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); }
.comm-menu{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
.comm-menu>.item{ min-width: 100px; height: 36px; font-size: 14px; border: 1px solid #D8D8D8; margin: 10px 10px 0;}
.comm-menu>.item>a{ display: block; line-height: 36px; color: #626262; text-decoration: none; text-align: center;}
.comm-menu>.item-two{ min-width: 100px; min-height: 50px; line-height: 20px; padding: 5px 20px; text-align: center; font-size: 14px; border: 1px solid #D8D8D8; margin: 10px 10px 0; display: flex; justify-content: center; align-items: center;}
.comm-menu>.item-two>a{ display: block; color: #626262; text-decoration: none; text-align: center;}
.comm-menu>.item-hov,.comm-menu>.item-two:hover,.comm-menu>.item:hover{ border: 1px solid #A7000D;}
.comm-menu>.item-hov>a,.comm-menu>.item-two:hover>a,.comm-menu>.item:hover>a{ color: #A7000D;}




.sbanner{ width: 100%; height: 400px; background-size: cover !important; background-position: 50% 50% !important; }
.sbanner-01{ background: url('../img/sbanner-01.jpg');}
.sbanner-02{ background: url('../img/sbanner-02.jpg');}
.sbanner-03{ background: url('../img/sbanner-03.jpg');}
.sbanner-04{ background: url('../img/sbanner-04.jpg');}
.sbanner-05{ background: url('../img/sbanner-05.jpg');}

/* 公司简介 */
.profile-wrap{ padding: 40px 0 0;}
/* .profile-wrap>.profile-l{ width: 330px;} */
.profile-wrap>.profile-r{ flex: 1; box-sizing: border-box; padding: 0 15px 15px; box-shadow: 0 1px 10px 0px rgba(79, 0, 0, 0.12);}
.profile-wrap>.profile-r>.s-name{ height: 60px; line-height: 60px; font-size: 16px; color: #333; font-weight: 600;}
.profile-wrap>.profile-r>.s-text{ font-size: 16px; line-height: 24px;}
.profile-wrap>.profile-r>.s-text>p{ color: #555;} 
.profile-wrap>.profile-r>.s-text>.s-mini{ line-height: 40px; padding: 0 0 5px 0;}

/* 公司动态 */
.news-wrap{ padding: 40px 0 0;}
.news-wrap>.list>.item{ position: relative; padding: 15px 0; cursor: pointer;}
.news-wrap>.list>.item::after{ position: absolute; content: ''; left: 0; right: 0; bottom: 0; height: 1px; background: #D8D8D8;}
.news-wrap>.list>.item>.date{ width: 100px; height: 70px; line-height: 40px; font-size: 18px; color: #666; position: relative;}
.news-wrap>.list>.item>.date::after{ position: absolute; content: ''; left: 0; top: 40px; width: 30px; height: 30px; background: url(../img/icon-news.png); background-size: cover !important; background-position: 50% 50% !important;}
.news-wrap>.list>.item>.info{ flex: 1; margin: 0 0 15px;}
.news-wrap>.list>.item>.info>.name{ height: 40px; line-height: 40px; font-size: 16px; font-weight: 600; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.news-wrap>.list>.item>.info>.name>a{ color: #333; text-decoration: none;}
.news-wrap>.list>.item>.info>.name>a:hover{ color: #A7000D;}
.news-wrap>.list>.item>.info>.text{ color: #666; font-size: 14px; line-height: 20px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; }
.news-wrap>.list>.item>.icon{ width: 230px; height: 160px;}
.news-wrap>.list>.item:hover::after{ background: #A7000D;}
.news-wrap>.list>.item:hover>.date{ color: #333;}
.news-wrap>.list>.item:hover>.date::after{ background: url(../img/icon-news_hov.png);}
.news-wrap>.list>.item:hover>.info>.name>a{ color: #A7000D;}

/* 产品中心 */
.goods-wrap{ padding: 40px 0 0;}
.goods-wrap>.goods-item{ margin: 0 0 15px;}
.goods-wrap>.goods-item>.icon{ width: 100%; height: 240px; margin: 0 0 15px; display: flex; justify-content: center; align-items: center;}
.goods-wrap>.goods-item>.info{ flex: 1; min-height: 240px; background: #FFF; box-shadow: 0px 1px 10px 0px rgba(79, 0, 0, 0.12); box-sizing: border-box; padding: 0 15px 15px;}
.goods-wrap>.goods-item>.info>.name{ height: 48px; line-height: 48px; font-size: 16px; color: #333; font-weight: 600;}
.goods-wrap>.goods-item>.info>.name>a{ color: #333; text-decoration: none;}
.goods-wrap>.goods-item>.info>.name>a:hover{ color: #A7000D;}
.goods-wrap>.goods-item>.info>.text{ color: #555; font-size: 15px; line-height: 25px;}
.goods-wrap>.goods-item>.info>.more{ height: 40px; line-height: 40px; display: flex; justify-content: flex-end; align-items: center;}
.goods-wrap>.goods-item>.info>.more>a{ color: #FFF; height: 32px; line-height: 32px; background: #A7000D; text-decoration: none; font-size: 14px; padding: 0 6px; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease;}
.goods-wrap>.goods-item>.info>.more>a:hover{ background: rgba(167, 0, 13, 0.8);}

/* 产品详情 */
.soft-wrap{ padding: 40px 0 0;}
.soft-wrap>.s-name{ height: 60px; line-height: 60px; font-size: 16px; color: #333; font-weight: 600;}
.soft-wrap>.s-text{ font-size: 15px; line-height: 25px; color: #555;}
.soft-wrap>.s-view>.item{ display: flex; justify-content: center; align-items: stretch;}
.soft-wrap>.biti{ font-weight:bold;  text-align:center;  font-size: 28px; }


.service{ display: flex; flex-wrap: wrap; min-height: 400px; align-items: center;}
.service>.item{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; box-sizing: border-box; flex: 1; padding: 0 10px; margin: 15px 0 0;}
.service>.item>.i-box{ color: #303030; height: 160px; box-sizing: border-box; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.service>.item>.i-box>.icon{ cursor: pointer;width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; margin: 0 auto;}
.service>.item>.i-box>.icon>.ads{ cursor: pointer;width: 60px; height: 60px; background-size: cover !important; background-position: 50% 50% !important;}
.service>.item>.i-box>.name{ cursor: pointer;height: 40px; line-height: 40px; text-align: center; font-size: 14px; font-weight: 600;}
.service>.item>.i-box>.info{ cursor: pointer;display: none; padding: 0 5px; text-align: center; font-size: 14px; line-height: 25px; height: 50px;}
.service>.item:nth-child(1)>.i-box>.icon>.ads{ background: url('../img/home/serv-01.png');}
.service>.item:nth-child(2)>.i-box>.icon>.ads{ background: url('../img/home/serv-02.png');}
.service>.item:nth-child(3)>.i-box>.icon>.ads{ background: url('../img/home/serv-03.png');}
.service>.item:nth-child(4)>.i-box>.icon>.ads{ background: url('../img/home/serv-04.png');}
.service>.item:nth-child(5)>.i-box>.icon>.ads{ background: url('../img/home/serv-05.png');}
.service>.item:nth-child(6)>.i-box>.icon>.ads{ background: url('../img/home/serv-06.png');}

.service>.item:hover>.i-box{ color: #FFF; background: rgba(167, 0, 13, 1); box-shadow:0 20px 50px rgba(167, 0, 13, 0.3); transform: translate(0,-5px); -webkit-transform: translate(0,-5px); -moz-transform: translate(0,-5px); -ms-transform: translate(0,-5px); -o-transform: translate(0,-5px); }
.service>.item:nth-child(1):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-01_hov.png');}
.service>.item:nth-child(2):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-02_hov.png');}
.service>.item:nth-child(3):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-03_hov.png');}
.service>.item:nth-child(4):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-04_hov.png');}
.service>.item:nth-child(5):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-05_hov.png');}
.service>.item:nth-child(6):hover>.i-box>.icon>.ads{ background: url('../img/home/serv-06_hov.png');}



.partners{ padding: 30px 0 10px; display: flex; flex-wrap: wrap;}
.partners>.item{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; box-sizing: border-box; flex: 1; padding: 0 12px; margin: 24px 0 0 0;}
.partners>.item>.box{ border: 1px solid #eee; background: #FFF; display: flex; justify-content: center; align-items: center;}
.partners>.item>.box>img{ width: 170px; height: 60px;}


.contact-wrap>.box{ padding: 40px 0 10px;}
.contact-wrap>.box .item{ background-color: rgba(255, 255, 255, 0.9); border: 1px solid #f1f1f1; border-radius: 4px; margin-bottom: 20px;} 
.contact-wrap>.box .item>.title:after{ position: absolute; content: ""; left: 0; right: 0; bottom: -5px; height: 1px; background-color: rgba(0, 0, 0, 0.05)}
.contact-wrap>.box .item>.title>.icon{ background-color: #A7000D; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; border-radius: 100%;}
.contact-wrap>.box .item>.title>.icon>img{ width: 24px; height: 24px;}
.contact-wrap>.box .item>.title>h4{ font-size: 20px; line-height: 40px; font-weight: 300; padding-left: 10px;}
.contact-wrap>.box .item>.text{ flex: 1;}
.contact-wrap>.box .item>.text>p{ margin-bottom: 0; font-size: 16px; font-weight: 200;}


@media (min-width: 576px) {
  
}

@media (min-width: 768px) {

  .header>.logo{ font-size: 18px;}
  .pc-tel .box>.txt{ font-size: 14px;}
  .pc-nav>ul.box>li{ padding: 0 10px; font-size: 14px;}

  .news-wrap>.list>.item>.info{ flex: 1; margin: 0 15px;}
  .goods-wrap>.goods-item>.icon{ width: 320px; height: 240px; margin: 0;}
  .goods-wrap>.goods-item>.info{ margin: 0 0 0 20px;}
  .goods-wrap>.goods-item>.info>.name{ height: 36px; line-height: 36px; font-size: 14px;}
  .goods-wrap>.goods-item>.info>.text{ font-size: 12px; line-height: 24px;}
  .profile-wrap>.profile-l{ width: 330px;}

  .service>.item{ -ms-flex: 0 0 33.33%; flex: 0 0 33.33%; max-width: 33.33%;}
  .partners>.item{ -ms-flex: 0 0 33.33%; flex: 0 0 33.33%; max-width: 33.33%;}
}

@media (min-width: 992px) {
  
  .goods-wrap>.goods-item>.info>.name{ height: 48px; line-height: 48px; font-size: 16px;}
  .goods-wrap>.goods-item>.info>.text{ font-size: 15px; line-height: 25px;}

  .service{ padding: 150px 0;}
  .service>.item{ -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; margin: 0;}
  .service>.item>.i-box{ height: 300px; padding: 0 0 20px;}
  .service>.item>.i-box>.icon{ width: 150px; height: 150px;}
  .service>.item>.i-box>.icon>.ads{ width: 80px; height: 80px;}
  .service>.item>.i-box>.name{ height: 60px; line-height: 60px; font-size: 16px;}
  .service>.item>.i-box>.info{ display: block;}

  .partners>.item{ -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
}

@media (min-width: 1200px) {
  .header>.logo{ font-size: 25px;}
  .pc-nav>ul.box>li{ padding: 0 10px; font-size: 15px;}
  .pc-tel .box{ height: 48px; line-height: 48px; margin: 0 15px 0 0; padding: 0 15px; border-radius: 48px; -webkit-border-radius: 48px; -moz-border-radius: 48px; -ms-border-radius: 48px; -o-border-radius: 48px; }
  .pc-tel .box>.ico{ display: block;}
  .pc-tel .box>.txt{ font-size: 16px;}
  .pc-nav>ul.box>li{ padding: 0 15px; font-size: 16px;}

  .partners>.item{ -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
}