/* CSS Document */


/***********************************************************/
/************************ home *****************************/


.section--banner .customize-tools{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 95%; z-index: 9; }
.section--banner .customize-tools .controls{ display: flex; align-items: center; justify-content: space-between; }
.section--banner .customize-tools .controls li{ cursor: pointer; }



/***********************************************************/
/***********************************************************/


.notice-highlight{ margin-bottom: 35px; }
.notice-highlight a{ display: flex; align-items: center; flex-flow: row wrap; border: 1px solid var(--blue100); border-radius: 5px; }
.notice-highlight--img{ width: 300px; line-height: 0; }

.notice-list--detail{ display: flex; justify-content: space-between; }
.notice-list--detail .notice--detail{ width: 32%; }
.notice-list--detail .notice--detail a{ display: block; border: 1px solid var(--blue100); border-radius: 5px; padding: 15px 20px; background-color: var(--white); }
.notice-highlight a:hover,
.notice-list--detail .notice--detail a:hover{ background-color: rgba(233, 235, 248, 0.4); }

.notice--detail .title{ font-size: 16px; line-height: 1.5; margin-bottom: 20px; }



.notice--detail.highlight{ width: calc(100% - 300px); padding: 0 50px; }
.notice--detail.highlight .title{ font-size: 18px; }


.notice-list--detail{ margin-left: -10px; margin-right: -10px; }
.notice-list--detail .build-col{ padding-left: 10px; padding-right: 10px; }


@media (max-width: 991px){

  .notice-list--detail{ margin-left: -7px; margin-right: -7px; }
  .notice-list--detail .build-col{ -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; padding-left: 7px; padding-right: 7px; }

}
@media (max-width: 767px){

  .notice-highlight--img{ width: 100%; }
  .notice--detail.highlight{ width: 100%; padding: 20px; }

  .notice-list--detail{ display: none; }

}


/***********************************************************/
/***********************************************************/


.recommend-item{ height: 100%; background-color: var(--white); border-radius: 10px; display: flex; flex-direction: column; }

.recommend-slider--detail{ padding: 15px; flex: 1 1 auto; }
.recommend-slider--detail .title{ font-size: var(--head5); line-height: 1.5; font-weight: 500; color: var(--primary); margin-bottom: 10px; }
.recommend-img img{ border-top-left-radius: 10px; border-top-right-radius: 10px; }
.recommend-slider--link{ padding: 10px 15px 20px; }




/**********************************************************/
/**********************************************************/

.bg-blog{ background-image: url('../images/home/bg-blog.png'); background-repeat: no-repeat; background-position: center top; background-size: cover; padding-top: 200px; padding-bottom: 80px; }

@media (max-width: 1999px){

  .bg-blog{ padding-top: 150px; }

}
@media (max-width: 991px){

  .bg-blog{ padding-bottom: 50px; }

}
@media (max-width: 767px){

  .bg-blog{ background-image: none; padding-top: 50px; }

}

.home-blognews{ display: flex; gap: 50px; justify-content: space-between; margin-bottom: 50px; }
.home-blognews--highlight, .home-blognews--list{ width: 50%; }
.home-blognews--highlight .boxnews-item .title{ font-size: var(--head5); }

@media (max-width: 1199px){

  .home-blognews{ gap: 30px; }

}
@media (max-width: 767px){

  .home-blognews{ flex-direction: column; margin-bottom: 30px; }
  .home-blognews--highlight, .home-blognews--list{ width: 100%; }

}


/**********************************************************/
/**********************************************************/