.blog-banner {position: relative;}
.blog-banner img {width: 100%;}
.blog-banner::after {content: ' ';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background-color: rgba(0, 0, 0, .6);z-index: 2;}
.blog-banner .blog-title {position: absolute;top: 20%;left: 50%;transform: translateX(-50%);z-index: 3;color: #fff;text-align: center;text-transform: uppercase;}
.blog-banner .blog-title h2 {color: #fff;font-size: 60px;font-family: 'TwCenMT Regular';position: relative;}
.blog-banner .blog-title h2 span {display: inline-block;width: 105px;height: 10px;border-radius: 5px;background-color: #f6b74e;position: absolute;bottom: -10px;left: 50%;transform: translateX(-50%);}
.blog-banner .blog-title p {font-size: 24px;margin-top: 46px;}
.blog-banner .bl-wrap {position: absolute;bottom: 0;left: 0;z-index: 3;}
.blog-banner .bl-wrap img {width: 100%;}
.blog-banner-title-2 {position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);width: 100%;max-width: 1300px;}
.blog-banner-title-2 a {color: #000;font-size: 20px;}
.blog-banner-title-2 span {font-size: 20px;}
.breadcrumbs-wrap {border-image-slice: 10;border-bottom: 1px solid;border-image-source: linear-gradient(to right, rgba(0,0,0,.3) 0%, rgba(255,255,255,.1) );line-height: 30px;}
.breadcrumbs-wrap i {color: #fd9923;margin-right: 10px;}



@media (max-width:786px) {
    .blog-banner .blog-title h2 {font-size: 20px;}
    .blog-banner .blog-title p {font-size: 16px; margin-top: 5px;line-height: 1;}
    .blog-banner-title-2 a,.blog-banner-title-2 span {font-size: 14px;}
    .breadcrumbs-wrap {padding-left: 40px;line-height: 1;}
    .blog-banner-title-2 {bottom: -15px;}
}