.elementor-3155 .elementor-element.elementor-element-04288b8{--display:flex;--margin-top:-91px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3155 .elementor-element.elementor-element-c608676{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3155 .elementor-element.elementor-element-c608676, .elementor-3155 .elementor-element.elementor-element-c608676.thegem-e-con-layout-thegem{--content-width:1400px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid.blog-style-justified .post-item .post-content-wrapper{background:#F2F5F6 !important;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-read-more .gem-inner-wrapper-btn{flex-direction:row;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid.blog-style-justified article{margin-bottom:10px;padding-left:calc( 10px / 2);padding-right:calc( 10px / 2);}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid.blog-style-justified .post-item:not(.sticky) .post-content-wrapper{border-radius:20px 20px 20px 20px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid.blog-style-justified .post-item:not(.sticky) .description{padding:0px 10px 0px 10px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item .post-image a img{border-radius:20px 20px 0px 0px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item .post-image a{border-radius:20px 20px 0px 0px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item:not(.sticky) .post-image{opacity:calc(100/100);}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item:not(.sticky) .entry-title span.light, .elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item:not(.sticky) .entry-title span.light a{font-family:"Arial", Sans-serif;font-size:18px;font-weight:600;text-transform:capitalize;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item:not(.sticky) .post-content-wrapper:hover .entry-title a{color:var( --e-global-color-5df5878 );}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid .post-item:not(.sticky) .post-content-wrapper:hover .sep{border-color:var( --e-global-color-5df5878 );}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .blog-grid-pagination .gem-pagination{margin-top:100px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .gem-pagination .page-numbers{border-radius:20px 20px 20px 20px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .gem-pagination .prev i, .elementor-3155 .elementor-element.elementor-element-bfdaa47 .gem-pagination .next i{font-size:24px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .gem-pagination .prev svg, .elementor-3155 .elementor-element.elementor-element-bfdaa47 .gem-pagination .next svg{width:24px;height:24px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-read-more .gem-button-container .gem-button{border-radius:20px 20px 20px 20px;font-size:16px;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-content-wrapper:hover .post-read-more .gem-button-container .gem-button span{color:#FFFFFF;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-content-wrapper:hover .post-read-more .gem-button-container .gem-button .gem-button-icon{color:#FFFFFF;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-content-wrapper:hover .post-read-more .gem-button-container .gem-button .gem-button-icon svg{fill:#FFFFFF;}.elementor-3155 .elementor-element.elementor-element-bfdaa47 .post-content-wrapper:hover .post-read-more .gem-button-container .gem-button{background-color:var( --e-global-color-5df5878 );}/* Start custom CSS for thegem-blog-grid, class: .elementor-element-bfdaa47 *//* =========================================================
   CJEC BLOG GRID
   Fix Large Blank Areas
   Add this CSS at the END of existing styles
========================================================= */


/* =========================================================
   1. CARD
   白色卡片，不要底部灰块
========================================================= */

.cjec-blog-grid-wrap article,
.cjec-blog-grid-wrap .portfolio-item,
.cjec-blog-grid-wrap .post-item,
.cjec-blog-grid-wrap .blog-grid-item {
  position: relative;

  height: auto !important;
  min-height: 0 !important;

  background: #ffffff !important;

  border-radius: 20px !important;

  overflow: hidden !important;

  box-shadow:
    0 8px 28px rgba(20, 20, 20, 0.055) !important;
}


/* TheGem内部wrap */
.cjec-blog-grid-wrap .portfolio-item .wrap,
.cjec-blog-grid-wrap article .wrap {
  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  background: #ffffff !important;
}


/* =========================================================
   2. IMAGE
   图片下面不要额外空隙
========================================================= */

.cjec-blog-grid-wrap .image,
.cjec-blog-grid-wrap .post-image,
.cjec-blog-grid-wrap .portfolio-image,
.cjec-blog-grid-wrap .wrap.image {
  margin: 0 !important;
  padding: 0 !important;

  line-height: 0 !important;
}


.cjec-blog-grid-wrap img {
  display: block !important;

  width: 100% !important;

  margin: 0 !important;

  vertical-align: middle !important;

  aspect-ratio: 16 / 10;

  object-fit: cover;
}


/* =========================================================
   3. HIDE UNUSED META AREA
   截图图片下面的大块空白很可能是TheGem meta区域
========================================================= */

.cjec-blog-grid-wrap .post-meta,
.cjec-blog-grid-wrap .portfolio-item-meta,
.cjec-blog-grid-wrap .post-date,
.cjec-blog-grid-wrap .entry-meta,
.cjec-blog-grid-wrap .date {
  display: none !important;

  width: 0 !important;
  height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
}


/* =========================================================
   4. CAPTION / CONTENT
   关键：删除之前的固定245px高度
========================================================= */

.cjec-blog-grid-wrap .caption,
.cjec-blog-grid-wrap .post-content,
.cjec-blog-grid-wrap .portfolio-item .wrap > .caption {
  display: flex !important;
  flex-direction: column !important;

  width: 100% !important;

  height: auto !important;

  /*
   关键！
   删除之前 min-height:245px 造成的底部空白
  */
  min-height: 0 !important;

  margin: 0 !important;

  padding:
    20px 24px
    22px !important;

  background: #ffffff !important;
}


/* =========================================================
   5. TITLE
========================================================= */

.cjec-blog-grid-wrap h2,
.cjec-blog-grid-wrap h3,
.cjec-blog-grid-wrap .title,
.cjec-blog-grid-wrap .post-title {
  margin:
    0 0 14px !important;

  padding:
    0 !important;

  color:
    #181818 !important;

  font-size:
    18px !important;

  line-height:
    1.48 !important;

  font-weight:
    600 !important;

  letter-spacing:
    -0.25px !important;

  text-transform:
    none !important;


  /* 最多三行 */
  display:
    -webkit-box !important;

  -webkit-box-orient:
    vertical !important;

  -webkit-line-clamp:
    3 !important;

  overflow:
    hidden !important;


  /*
   三行标题高度统一
   保证按钮基本水平对齐
  */
  min-height:
    calc(1.48em * 3) !important;
}


/* Title Link */

.cjec-blog-grid-wrap h2 a,
.cjec-blog-grid-wrap h3 a,
.cjec-blog-grid-wrap .title a,
.cjec-blog-grid-wrap .post-title a {
  color:
    #181818 !important;

  text-decoration:
    none !important;

  transition:
    color .2s ease !important;
}


.cjec-blog-grid-wrap h2 a:hover,
.cjec-blog-grid-wrap h3 a:hover,
.cjec-blog-grid-wrap .title a:hover,
.cjec-blog-grid-wrap .post-title a:hover {
  color:
    #ff7700 !important;
}


/* =========================================================
   6. REMOVE EXCERPT SPACE
   如果当前Grid没有展示Description
   就不要让隐藏区域继续占高度
========================================================= */

.cjec-blog-grid-wrap .description:empty,
.cjec-blog-grid-wrap .post-excerpt:empty,
.cjec-blog-grid-wrap .excerpt:empty {
  display:
    none !important;

  margin:
    0 !important;

  padding:
    0 !important;

  min-height:
    0 !important;
}


/* =========================================================
   7. BUTTON AREA
========================================================= */

.cjec-blog-grid-wrap .links,
.cjec-blog-grid-wrap .post-footer,
.cjec-blog-grid-wrap .portfolio-item-footer {
  display: flex !important;

  align-items: center !important;

  justify-content: flex-start !important;

  gap: 10px !important;

  width: 100% !important;

  margin:
    3px 0 0 !important;

  padding:
    0 !important;

  border:
    0 !important;

  background:
    transparent !important;
}


/* =========================================================
   8. READ MORE
========================================================= */

.cjec-blog-grid-wrap .read-more,
.cjec-blog-grid-wrap .more-link,
.cjec-blog-grid-wrap .gem-button {
  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  min-width: 132px !important;

  min-height: 40px !important;

  padding:
    0 18px !important;

  border:
    1px solid rgba(255,119,0,.34) !important;

  border-radius:
    999px !important;

  background:
    #fff8f2 !important;

  color:
    #e76600 !important;

  font-size:
    14px !important;

  line-height:
    1 !important;

  font-weight:
    600 !important;

  text-transform:
    none !important;

  text-decoration:
    none !important;

  box-shadow:
    none !important;

  transition:
    all .22s ease !important;
}


.cjec-blog-grid-wrap .read-more:hover,
.cjec-blog-grid-wrap .more-link:hover,
.cjec-blog-grid-wrap .gem-button:hover {
  border-color:
    #ff7700 !important;

  background:
    #ff7700 !important;

  color:
    #ffffff !important;

  transform:
    translateY(-1px);

  box-shadow:
    0 8px 20px rgba(255,119,0,.18) !important;
}


/* =========================================================
   9. SHARE BUTTON
========================================================= */

.cjec-blog-grid-wrap .share,
.cjec-blog-grid-wrap .share-button,
.cjec-blog-grid-wrap .portfolio-sharing-pane,
.cjec-blog-grid-wrap .socials-sharing {
  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  width:
    40px !important;

  height:
    40px !important;

  min-width:
    40px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    1px solid rgba(255,119,0,.28) !important;

  border-radius:
    50% !important;

  background:
    #fff8f2 !important;

  color:
    #ff7700 !important;

  box-shadow:
    none !important;

  transition:
    all .22s ease !important;
}


.cjec-blog-grid-wrap .share:hover,
.cjec-blog-grid-wrap .share-button:hover {
  border-color:
    #ff7700 !important;

  background:
    #ff7700 !important;

  color:
    #ffffff !important;

  transform:
    translateY(-1px);
}


/* =========================================================
   10. REMOVE EMPTY BOTTOM AREA
========================================================= */

.cjec-blog-grid-wrap .caption::after,
.cjec-blog-grid-wrap .wrap::after {
  display:
    none !important;
}


/*
清理TheGem可能给caption设置的固定底部区域
*/
.cjec-blog-grid-wrap .caption > *:last-child {
  margin-bottom:
    0 !important;
}


/* =========================================================
   11. IMAGE / CONTENT JOIN
   图片和正文连接更自然
========================================================= */

.cjec-blog-grid-wrap .portfolio-image + .caption,
.cjec-blog-grid-wrap .image + .caption,
.cjec-blog-grid-wrap .post-image + .post-content {
  margin-top:
    0 !important;
}


/* =========================================================
   12. CARD HOVER
========================================================= */

.cjec-blog-grid-wrap article:hover,
.cjec-blog-grid-wrap .portfolio-item:hover {
  transform:
    translateY(-5px);

  box-shadow:
    0 18px 42px rgba(20,20,20,.09) !important;
}


/* =========================================================
   13. MOBILE
========================================================= */

@media (max-width: 767px) {

  .cjec-blog-grid-wrap .caption,
  .cjec-blog-grid-wrap .post-content,
  .cjec-blog-grid-wrap .portfolio-item .wrap > .caption {
    padding:
      18px 18px
      19px !important;
  }


  .cjec-blog-grid-wrap h2,
  .cjec-blog-grid-wrap h3,
  .cjec-blog-grid-wrap .title,
  .cjec-blog-grid-wrap .post-title {
    font-size:
      17px !important;

    line-height:
      1.48 !important;

    /*
     移动端不强制三行固定高度
    */
    min-height:
      0 !important;
  }


  .cjec-blog-grid-wrap .read-more,
  .cjec-blog-grid-wrap .more-link,
  .cjec-blog-grid-wrap .gem-button {
    min-width:
      120px !important;

    min-height:
      38px !important;
  }


  .cjec-blog-grid-wrap .share,
  .cjec-blog-grid-wrap .share-button {
    width:
      38px !important;

    height:
      38px !important;

    min-width:
      38px !important;
  }

}/* End custom CSS */