header.header_solid{box-shadow: 0px 19px 42px 0px #8F8F8F1A;}
.breadcrumb_bar{border: 0;}

/* blog name */
.blog-detail-section{padding-top: 0;}
.blog-detail-wrapper{padding-top: 20px; display: flex; gap: 50px;}
.blog-detail-left{width: calc(100% - 380px);}
.blog-detail-right{width: 380px; height: 100vh; position: sticky; top: 0; transition: all 0.5s;}
.blog-detail-right.is-scroll-up{top: 30px;}
.blog-detail-head-mobile form{display: none;}
.recent-mobile{display: none;}

.blog-heading{font-size: 32px; line-height: 1.4; font-weight: 400; color: #333333; margin-bottom: 21px;}
.blog-date-share{display: flex; align-items: center; justify-content: space-between; padding: 20px 0 15px 0; border-top: 1px solid #8A93A54D; border-bottom: 1px solid #8A93A54D;}
.blog-date{display: flex; align-items: center; justify-content: space-between; gap: 15px;}
.blog-date-a{font-size: 14px; font-weight: 500; line-height: 1.1; color: #4d4d4d;} 
.share-text{font-size: 18px; font-weight: 500; color: #636266; line-height: 1.1;}
.blog-share{display: flex; align-items: center; justify-content: space-between; gap: 5px;}
.share-item{display: flex; align-items: center; justify-content: space-between; gap: 15px;}
.share-item .share-icon svg{width: 100%; height: 100%;}
.share-item .share-icon {width: 32px; height: 32px;}


.blog-detail-area-text h2{font-size: 24px; font-weight: 400; color: #333333; line-height: 1.5; padding-bottom: 17px;}
.blog-detail-area-text p{font-size: 16px; font-weight: 400; color: #4d4d4d; line-height: 1.5; padding-bottom: 24px; margin-bottom: 0;}
.blog-detail-img {padding: 24px 0 40px 0;}
.blog-detail-img img{width: 100%; height: 100%; display: block;}
  
.blog-search{border-bottom: 1px solid #4D4D4D; border-radius: 6px; display: flex; align-items: center; padding: 10px 6px 15px; gap: 13px; margin-bottom: 20px;}
.blog-search input{padding: 0; border: 0;}
.blog-search input[type="search"]::-webkit-search-cancel-button {-webkit-appearance: none; appearance: none;}

/* Optional: also remove other default decorations */
.blog-search input[type="search"]::-webkit-search-decoration,
.blog-search input[type="search"]::-webkit-search-results-button,
.blog-search input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}
.blog-search span{display: block; width: 20px; height: 20px;}
.recent-blog-heading{font-size: 24px; line-height: 1.4; font-weight: 400; color: #333333; padding-bottom: 20px;}
.blog_card{background-color: transparent; padding-bottom: 30px;}
.blog_card:last-child{padding-bottom: 0;}
.recent-blog-list{background-color: #F8F8F8; padding: 36px 23px 60px; height: 93%;}
.recetn-blog-list-wrapper{overflow-y: auto; overflow-x: hidden; scrollbar-width: none; height: calc(100% - 40px);}





 
@media screen and (max-width:1400px) {

    .blog-heading{font-size: 28px;}
    .share-text{font-size: 16px;}
    
}

@media screen and (max-width:1200px) {

    .blog-detail-right{top: -40px;}
    .blog-detail-right.is-scroll-up{top: 0px;}
    .recent-blog-list{height: 96%;}
}

@media screen and (max-width:1024px) {
  
  .blog-heading{font-size: 24px; margin-bottom: 15px;}
  .blog-detail-right{display: none;}
  .blog-detail-left{width: 100%;}
  .blog-detail-head-mobile form{display: block;}
  .blog-detail-wrapper{flex-direction: column; padding-bottom: 20px;}
  .recent-mobile{display: block;}
  .blog-detail-section{padding-bottom: 0;}
  .recent-blog-list{padding: 30px 15px 50px;}
  .blog_card{background-color: #fff;}
  .blog_body{padding: 15px;}
  .blog-list-item-a{height: auto;}
}

@media screen and (max-width:767px) {

  .blog-date-a{font-size: 12px; }
  .share-text{font-size: 14px;}
  .share-item{gap: 10px;}
  .share-item .share-icon{width: 28px; height: 28px;}
  .blog-heading{font-size: 20px;}
  .blog-detail-area-text p{padding-bottom: 15px; font-size: 14px;}
  .blog-detail-area-text h2{font-size: 20px; padding-bottom: 10px;}
  .blog-detail-img{padding: 18px 0 20px 0;}
  .blog-date-share{padding: 15px 0 12px 0;}
  .blog-detail-wrapper{padding-top: 10px;}
}

@media screen and (max-width:600px) {

  .blog-date-share{flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 15px;}
  .blog-date{gap: 8px;}
  .blog-heading{font-size: 18px; margin-bottom: 10px;}
}