@charset "utf-8";
/* ==========================================================================
   产品详情页（应用案例模板 view_product_app.htm）
   版式：上面是标题 —— 中间是图片与正文内容 —— 下面是留言表单
   所有规则限定在 .product-article 内，不影响模板其它页面
   ========================================================================== */

/* ---------- 容器 ---------- */
.product-article {  margin: 0 auto; padding: 10px 0 20px; }

/* ---------- ① 标题 ---------- */
.product-article .pa-head { padding: 20px 0 45px; text-align: center; }
.product-article .pa-title { color: #333; font-size: 30px; font-weight: normal; line-height: 1.35; word-break: break-word; }
.product-article .pa-line { display: block; width: 40px; height: 2px; margin: 18px auto 0; border: 0; background-color: #004DDB; }
.product-article .pa-meta { margin-top: 14px; color: #8c8c8c; font-size: 14px; }
.product-article .pa-meta span { display: inline-block; margin: 0 10px; }

/* ---------- ② 产品图 ---------- */
.product-article .pa-gallery { float: none; width: 100%; max-width: 720px; margin: 0 auto; }
.product-article .pa-gallery .product-image { border: 1px solid #e6e6e6; background: #fff; }
.product-article .pa-gallery .image-additional { width: 100%; margin: 15px auto 0; }
.product-article .pa-gallery .image-additional li img { width: 86%; padding: 2px; border: 1px solid #e0e0e0; background: #fff; }
.product-article .pa-gallery .image-additional li.current img { border-color: #004DDB; }
.product-article .pa-gallery .swiper-button-prev,
.product-article .pa-gallery .swiper-button-next { color: #bbb; }

/* ---------- ③ 正文内容 ---------- */
.product-article .pa-content { margin-top: 0px; }
.product-article .pa-lead { max-width: 780px; margin: 0 auto 40px; color: #8c8c8c; font-size: 15px; line-height: 1.9; text-align: center; }
.product-article .pa-lead p { color: #8c8c8c; }
.product-article .edibox { color: #666; font-size: 15px; line-height: 2; }
.product-article .edibox p { margin: 0 0 18px; color: #666; line-height: 2; }
.product-article .edibox img { display: block; max-width: 100%; height: auto !important; margin: 20px auto; }
.product-article .edibox ul,
.product-article .edibox ol { margin: 0 0 18px 1.4em; }
.product-article .edibox li { list-style: disc; line-height: 2; }
.product-article .pa-tags { margin-top: 45px; padding-top: 35px; border-top: 1px dashed #e0e0e0; }
.product-article .pa-sub { margin-bottom: 18px; color: #333; font-size: 18px; font-weight: bold; }

/* ---------- ④ 按钮 ---------- */
.product-article .pa-actions { margin-top: 50px; text-align: center; font-size: 0; }
.product-article .pa-actions a {
  display: inline-block; height: 46px; line-height: 44px; padding: 0 34px; margin: 6px 8px;
  border: 1px solid #004DDB; border-radius: 46px; font-size: 14px; text-align: center;
  -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out;
}
.product-article .pa-actions .email { background-color: #004DDB; color: #fff; }
.product-article .pa-actions .email:hover { background-color: #0039a6; border-color: #0039a6; color: #fff; }
.product-article .pa-actions .pdf { border-color: #ddd; color: #666; }
.product-article .pa-actions .pdf:hover { border-color: #004DDB; color: #004DDB; }

/* ---------- 响应式 ---------- */
@media only screen and (max-width: 950px) {
  .product-article { max-width: none; }
  .product-article .pa-gallery .product-image { display: block; }
  .product-article .pa-gallery .image-additional li img { width: 90%; margin: 0 5%; }
}
@media only screen and (max-width: 767px) {
  .product-article .pa-head { padding: 10px 0 30px; }
  .product-article .pa-title { font-size: 22px; }
  .product-article .pa-line { margin-top: 12px; }
  .product-article .pa-content { margin-top: 30px; }
  .product-article .pa-lead { margin-bottom: 25px; font-size: 14px; }
  .product-article .edibox { font-size: 14px; }
  .product-article .pa-actions { margin-top: 35px; }
  .product-article .pa-actions a { display: block; width: 100%; max-width: 320px; margin: 8px auto; }
  .product-article .pa-tags { margin-top: 30px; padding-top: 25px; }
}