/* Hanke site.css - consolidated from all pages */
/* Generated: 2026-05-19 09:28 */

/* ===== Global theme & reset (all pages) ===== */
/*********** reset start **************/
    body {
      color: var(--text-color, #666);
      font-size: 16px;
      line-height: 1.4;
      font-weight: 400;
      text-align: left;
      background: #ffffff;
      font-family: var(--font-family);
      -webkit-font-smoothing: antialiased;
      -moz-font-smoothing: antialiased;
      overflow-x: hidden;
    }
  
    body * {
      margin: 0;
      padding: 0;
      outline: none !important;
      line-height: 1.4;
    }
  
    button, input, textarea {
      border: none;
    }
  
    /*********** v2、 v3标题 start **************/
    h1, .h1 {
      font-size: 36px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h2, .h2 {
      font-size: 32px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h3, .h3 {
      font-size: 24px;
      font-weight: 600;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h4, .h4 {
      font-size: 16px;
      font-weight: 400;
      color: var(--text-color, #555);
      font-family: var(--title-font-family);
    }
    h5, .h5 {
      font-size: 14px;
      font-weight: 400;
      color: var(--text-color, #888);
      font-family: var(--title-font-family);
    }
  
    @media only screen and (max-width: 767px) {
      h1, .h1 {
        font-size: 22px;
      }
      h2, .h2 {
        font-size: 20px;
      }
      h3, .h3 {
        font-size: 18px;
      }
    }
    /*********** 标题 end **************/
  
    /*********** v2、 v3颜色 start **************/
    :root {
      --color-primary:#332c2b;
      --color-primary-rgb:51,44,43;
      --color-second:#d70012;
      --color-second-rgb:215,0,18;
      --bg-color: #F4F4F4;
      --btn-hover: #332c2b;
      --button-radius: 0px;
      --font-family: Montserrat;
      --title-font-family: Montserrat_Bold;
      --text-color: #666;
      --text-color-rgb: 102,102,102;
      --title-text-color: #212121;
      --title-text-color-rgb: 33,33,33;
    }
    /*********** v2、 v3颜色 end **************/
      
    a {
      color: inherit;
      text-decoration: none;
    }
  
    a:hover {
      text-decoration: none;
      color: var(--color-primary);
    }
  
    ol,
    ul {
      list-style: none;
    }
  
    i,
    em {
      font-style: normal;
    }
  
    .rich-text ol {
      list-style: decimal;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul {
      list-style: disc;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul li {
      list-style: disc;
    }
  
    .rich-text em {
      font-style: italic;
    }
  
    img {
      max-width: 100%;
    }
  
    .fr,
    .float-right {
      float: right;
    }
  
    .fl,
    .float-left {
      float: left;
    }
  
    .uppercase {
      text-transform: uppercase;
    }
  
    /* RTL布局 */
    html[dir="rtl"] body {
      text-align: right;
    }
  
    /* 清除浮动 */
    .cl {
      zoom: 1;
    }
  
    .cl:before,
    .cl:after {
      display: table;
      content: " ";
    }
  
    .cl:after {
      clear: both;
    }
  
    /*富文本内置样式*/
    .mce-img-32 {width: 32px;height: auto;} .mce-img-64 {width: 64px;height: auto;} .mce-img-240 {width: 240px;height: auto;} .mce-img-480 {width: 480px;height: auto;} .mce-img-600 {width: 600px;height: auto;} .mce-img-1024 {width: 1024px;height: auto;} .mce-img-2048 {width: 2048px;height: auto;} .mce-img-w-100 {width: 100%;height: auto;}
  
    /* 字体 */
  
    @font-face {
      font-family: "Montserrat";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
    }
    @font-face {
      font-family: "Montserrat_Bold";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
    }

/* ===== From: blog.html ===== */
/*********** reset start **************/
    body {
      color: var(--text-color, #666);
      font-size: 16px;
      line-height: 1.4;
      font-weight: 400;
      text-align: left;
      background: #ffffff;
      font-family: var(--font-family);
      -webkit-font-smoothing: antialiased;
      -moz-font-smoothing: antialiased;
      overflow-x: hidden;
    }
  
    body * {
      margin: 0;
      padding: 0;
      outline: none !important;
      line-height: 1.4;
    }
  
    button, input, textarea {
      border: none;
    }
  
    /*********** v2、 v3标题 start **************/
    h1, .h1 {
      font-size: 36px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h2, .h2 {
      font-size: 32px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h3, .h3 {
      font-size: 24px;
      font-weight: 600;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h4, .h4 {
      font-size: 16px;
      font-weight: 400;
      color: var(--text-color, #555);
      font-family: var(--title-font-family);
    }
    h5, .h5 {
      font-size: 14px;
      font-weight: 400;
      color: var(--text-color, #888);
      font-family: var(--title-font-family);
    }
  
    @media only screen and (max-width: 767px) {
      h1, .h1 {
        font-size: 22px;
      }
      h2, .h2 {
        font-size: 20px;
      }
      h3, .h3 {
        font-size: 18px;
      }
    }
    /*********** 标题 end **************/
  
    /*********** v2、 v3颜色 start **************/
    :root {
      --color-primary:#332c2b;
      --color-primary-rgb:51,44,43;
      --color-second:#d70012;
      --color-second-rgb:215,0,18;
      --bg-color: #F4F4F4;
      --btn-hover: #332c2b;
      --button-radius: 0px;
      --font-family: Montserrat;
      --title-font-family: Montserrat_Bold;
      --text-color: #666;
      --text-color-rgb: 102,102,102;
      --title-text-color: #212121;
      --title-text-color-rgb: 33,33,33;
    }
    /*********** v2、 v3颜色 end **************/
      
    a {
      color: inherit;
      text-decoration: none;
    }
  
    a:hover {
      text-decoration: none;
      color: var(--color-primary);
    }
  
    ol,
    ul {
      list-style: none;
    }
  
    i,
    em {
      font-style: normal;
    }
  
    .rich-text ol {
      list-style: decimal;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul {
      list-style: disc;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul li {
      list-style: disc;
    }
  
    .rich-text em {
      font-style: italic;
    }
  
    img {
      max-width: 100%;
    }
  
    .fr,
    .float-right {
      float: right;
    }
  
    .fl,
    .float-left {
      float: left;
    }
  
    .uppercase {
      text-transform: uppercase;
    }
  
    /* RTL布局 */
    html[dir="rtl"] body {
      text-align: right;
    }
  
    /* 清除浮动 */
    .cl {
      zoom: 1;
    }
  
    .cl:before,
    .cl:after {
      display: table;
      content: " ";
    }
  
    .cl:after {
      clear: both;
    }
  
    /*富文本内置样式*/
    .mce-img-32 {width: 32px;height: auto;} .mce-img-64 {width: 64px;height: auto;} .mce-img-240 {width: 240px;height: auto;} .mce-img-480 {width: 480px;height: auto;} .mce-img-600 {width: 600px;height: auto;} .mce-img-1024 {width: 1024px;height: auto;} .mce-img-2048 {width: 2048px;height: auto;} .mce-img-w-100 {width: 100%;height: auto;}
  
    /* 字体 */
  
    @font-face {
      font-family: "Montserrat";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
    }
    @font-face {
      font-family: "Montserrat_Bold";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
    }

/* ===== From: index.html ===== */
/*********** reset start **************/
    body {
      color: var(--text-color, #666);
      font-size: 16px;
      line-height: 1.4;
      font-weight: 400;
      text-align: left;
      background: #ffffff;
      font-family: var(--font-family);
      -webkit-font-smoothing: antialiased;
      -moz-font-smoothing: antialiased;
      overflow-x: hidden;
    }
  
    body * {
      margin: 0;
      padding: 0;
      outline: none !important;
      line-height: 1.4;
    }
  
    button, input, textarea {
      border: none;
    }
  
    /*********** v2、 v3标题 start **************/
    h1, .h1 {
      font-size: 36px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h2, .h2 {
      font-size: 32px;
      font-weight: 700;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h3, .h3 {
      font-size: 24px;
      font-weight: 600;
      color: var(--title-text-color, #000);
      font-family: var(--title-font-family);
    }
    h4, .h4 {
      font-size: 16px;
      font-weight: 400;
      color: var(--text-color, #555);
      font-family: var(--title-font-family);
    }
    h5, .h5 {
      font-size: 14px;
      font-weight: 400;
      color: var(--text-color, #888);
      font-family: var(--title-font-family);
    }
  
    @media only screen and (max-width: 767px) {
      h1, .h1 {
        font-size: 22px;
      }
      h2, .h2 {
        font-size: 20px;
      }
      h3, .h3 {
        font-size: 18px;
      }
    }
    /*********** 标题 end **************/
  
    /*********** v2、 v3颜色 start **************/
    :root {
      --color-primary:#332c2b;
      --color-primary-rgb:51,44,43;
      --color-second:#d70012;
      --color-second-rgb:215,0,18;
      --bg-color: #F4F4F4;
      --btn-hover: #332c2b;
      --button-radius: 0px;
      --font-family: Montserrat;
      --title-font-family: Montserrat_Bold;
      --text-color: #666;
      --text-color-rgb: 102,102,102;
      --title-text-color: #212121;
      --title-text-color-rgb: 33,33,33;
    }
    /*********** v2、 v3颜色 end **************/
      
    a {
      color: inherit;
      text-decoration: none;
    }
  
    a:hover {
      text-decoration: none;
      color: var(--color-primary);
    }
  
    ol,
    ul {
      list-style: none;
    }
  
    i,
    em {
      font-style: normal;
    }
  
    .rich-text ol {
      list-style: decimal;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul {
      list-style: disc;
      width: fit-content;
      text-align: left;
      padding-left: 38px;
      margin-top: 10px;
      margin-bottom: 10px;
    }
  
    .rich-text ul li {
      list-style: disc;
    }
  
    .rich-text em {
      font-style: italic;
    }
  
    img {
      max-width: 100%;
    }
      :not(.rich-text) img {
        width: auto;
        height: auto;
      }
  
    .fr,
    .float-right {
      float: right;
    }
  
    .fl,
    .float-left {
      float: left;
    }
  
    .uppercase {
      text-transform: uppercase;
    }
  
    /* RTL布局 */
    html[dir="rtl"] body {
      text-align: right;
    }
  
    /* 清除浮动 */
    .cl {
      zoom: 1;
    }
  
    .cl:before,
    .cl:after {
      display: table;
      content: " ";
    }
  
    .cl:after {
      clear: both;
    }
  
    /*富文本内置样式*/
    .mce-img-32 {width: 32px;height: auto;} .mce-img-64 {width: 64px;height: auto;} .mce-img-240 {width: 240px;height: auto;} .mce-img-480 {width: 480px;height: auto;} .mce-img-600 {width: 600px;height: auto;} .mce-img-1024 {width: 1024px;height: auto;} .mce-img-2048 {width: 2048px;height: auto;} .mce-img-w-100 {width: 100%;height: auto;}
  
    /* 字体 */
  
    @font-face {
      font-family: "Montserrat";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
    }
    @font-face {
      font-family: "Montserrat_Bold";
      font-display: swap;
      src: url('https://shopcdnpro.grainajz.com/tpl-common/common/css/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
    }

/* ===== From: intelligent-warehouse-logistics.html ===== */
table.ztable{word-break:break-word;}
table.ztable tr>td{border:solid 1px #ccc}
table.ztable tr>th,table.ztable thead tr>td{border:solid 1px #ccc}

/* ===== From: product-detail.html ===== */
.jmutil_321{width:100%;margin:0 auto;}.jmutil_321 .muti_row {display: flex;justify-content: space-between;flex-wrap: wrap;-webkit-align-items: center;align-items: center;margin: 0;margin-bottom:0px;}.jmutil_321 .muti_row:nth-child(2n+1) {-webkit-flex-direction: row-reverse;flex-direction: row-reverse;}.jmutil_321 .muti_row .hover_pic{width: 30%;}.jmutil_321 .muti_row .mutitxt {width: 70%;}.jmutil_321 .muti_row .hover_pic p,.jmutil_321 .muti_row .mutitxt h5, .muti_row .mutitxt p,.jmutil_321 ul{margin:0px;padding:0px;}.jmutil_321 .muti_row .hover_pic p{text-align:center;line-height:0px;}.jmutil_321 .muti_row .hover_pic img{max-width:100%;transition:all 0.3s ease 0s; margin:0 auto;}.jmutil_321 .muti_row .box {width: 100%;padding: 0 20px;box-sizing: border-box;}.jmutil_321 .muti_row .box h5 {font-size:30px;color:#000;margin-bottom:30px;}.jmutil_321 .muti_row .box p {font-size: 18px;color: #514f4f;line-height: 25px;margin: 20px 0 0;}.jmutil_321 .muti_row .hover_pic:hover img{transform:scale(1.08);-webkit-transform:scale(1.08);}.jmutil_321 .muti_row  .hover_pic{display:block;overflow:hidden;border-radius: 0px;}@media screen and (max-width: 1280px) {.jmutil_321 .muti_row .box h5:first-of-type {margin-bottom: 22px;}.jmutil_321 .muti_row .box h5 {font-size: 24px;line-height: 1.1;}.jmutil_321 .muti_row .box p {font-size: 16px;line-height: 24px;margin: 15px 0 0;}}@media screen and (max-width: 768px) {.jmutil_321 .muti_row {margin: 0 0 15px;-webkit-flex-direction: column;flex-direction: column;}.jmutil_321 .muti_row .hover_pic, .jmutil_321 .muti_row .mutitxt {width: 100%;} .jmutil_321 .muti_row .box h5:first-of-type {margin-bottom: 20px;}.jmutil_321 .muti_row .box h5 {font-size: 22px;}.jmutil_321 .muti_row .box p {font-size: 16px;line-height: 24px;margin: 15px 0 0;}.jmutil_321 .muti_row .box {padding: 20px 0 0;}}

/* ===== Site navigation enhancements ===== */
.product-breadcrumb-wrap {
  padding: 20px 15px 0;
}

.product-breadcrumb {
  font-size: 14px;
  color: var(--text-color, #666);
}

.product-breadcrumb a {
  color: var(--color-primary);
}

.product-breadcrumb a:hover {
  text-decoration: underline;
}

.product-breadcrumb .sep {
  margin: 0 8px;
  color: #999;
}

.product-breadcrumb .current {
  color: var(--title-text-color, #000);
}

.sung-prodetail .product-back-link {
  margin-bottom: 12px;
}

.sung-prodetail .product-back-link a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  color: var(--color-primary);
}

.sung-prodetail .product-back-link a:hover {
  text-decoration: underline;
}

.sung-prodetail .detail-recom .list-link.text-center {
  margin-top: 24px;
  text-align: center;
}

.sung-prodetail #product-intro,
.sung-prodetail #product-spec,
.sung-prodetail #product-faq,
.sung-prodetail #product-more {
  scroll-margin-top: 140px;
}

/* product-detail FAQ accordion */
.sung-prodetail #product-faq .accordion_area .card-2 {
  overflow: hidden;
  transition: box-shadow 0.28s ease;
}

.sung-prodetail #product-faq .accordion_area .card-2.active {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.sung-prodetail #product-faq .accordion_area .collapse {
  transition: height 0.32s ease;
}

.sung-prodetail #product-faq .witr_ac_style {
  position: relative;
  transition: color 0.28s ease, background-color 0.28s ease;
}

.arshine-solu-list ul li[id] {
  scroll-margin-top: 120px;
}

/* ===== Swiper enhancements ===== */
.swiper {
  overflow: hidden;
}

.swiper-slide img {
  display: block;
  max-width: 100%;
}

.swiper-button-disabled {
  opacity: 0.35;
  pointer-events: none;
  cursor: default;
}

.sung_news_headline .swiper,
#huake-banner .swiper,
#bobo-banner .swiper {
  width: 100%;
}
