@charset "UTF-8";
*,*:after,*:before {box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
.clearfix:after {content: "";display: block;height: 0;width: 100%;clear: both;}
body {font-family: Inter, Arial, Helvetica, sans-serif;font-weight: 400;font-size: 14px;margin: 0;padding: 0;list-style: none;line-height: 1.4;color: #000;}
.fw {width: 100%;}
img{border: 0;max-width: 100%;}
img:hover {cursor: pointer;}
a{text-decoration: none;border: none;color: inherit;}
a:hover,.clr-behome,.behome-heading a:hover > span,.menu-item.active,.article-detail-button > div:hover{color: #b59779 !important;}
.container {width: 1180px;margin: 0 auto;}
.text-ellipsis-2-line {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.text-ellipsis-3-line {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.sticky {position: fixed;top: 0;width: 100%;z-index: 999;}
.hidden {display: none;}
.lt{float: left;}.rt{float: right;}
/* header-qc */
.hna-qc{text-align: center;}
.hna-qc img{height: auto;}
/* frmSearch */
#frmSearch{display: flex;height: 35px;border: 1px solid #e6e6e6;background: #fff;border-radius: 35px;}
#frmSearch input{outline: none;border: 0;padding: 0 10px;background: transparent;}
#frmSearch button{cursor: pointer;outline: none;border: 0;background: none;}
#frmSearch button .fa-magnifying-glass{font-size: 18px;width: 18px;}
/* header-menu */
.header-menu {z-index: 999;position: sticky;top: 0;background: #fde016;height: 67px;}
.header-menu > .container {display: flex;flex-direction: row;align-items: center;justify-content: space-between;}
.behome-menu{display: flex;align-items: center;gap: 30px;}
.menu-item {position: relative;z-index: 1;font: 300 16px/1.2 Inter;}
.menu-item > a{text-transform: uppercase;background: url(../images/ico-square.png) left center no-repeat;padding-left: 20px;display: block;line-height: 67px;}
.menu-item.active > a{color: #d78300;}
.logo{margin: 0;}
.logo a{display: block;line-height: 0;}
.menu-sub {display: none;position: absolute;min-width: 200px;z-index: 9999;}
.menu-item:hover .menu-sub{display: block;}
.menu-sub a {display: block;width: 100%;background: #fff;padding: 10px 15px;font-size: 15px;font-weight: 400;}
.menu-sub a:not(:first-child){border-top: 1px solid #dedede;}
/* home-page-content */
.home-page {padding: 40px 0;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 40px;background-color: #fff;}
.col-left {width: 820px;display: flex;flex-direction: column;gap: 24px;}
.col-right {width: 300px;display: flex;flex-direction: column;gap: 24px;}
/* article */
.article-image{position: relative;display: block;overflow: hidden;width: 100%;}
.article-image::before{padding-top: 66%;content: '';display: block;}
.article-image > img{position: absolute;top: 0;z-index: 1;width: 100%;min-height: 100%;object-fit: cover;}
.article-title{margin: 0;font-weight: 700;font-size: 16px;line-height: 1.6;color: #080c27;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.article-link{color: inherit;}
.article-desc{color: #080c27;font-weight: 400;line-height: 1.6;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.article-meta{font-weight: 400;font-size: 14px;color: #bbb;}
.article-date > i{margin-right: 5px;min-width: 11px;}
.article-cat{color: #ea0000;text-transform: uppercase;}
.article-cat::after {content: '';width: 1px;height: 11px;display: inline-block;background: #bbb;margin-left: 8px;vertical-align: -1px;margin-right: 3px;}
/* behome-content */
.behome-content{padding: 60px 0 35px 0;}
/* behome-cover */
.behome-cover{position: relative;}
.behomeSlider {
visibility: hidden; 
opacity: 0;
transition: opacity 0.3s ease-in-out;
}
.behomeSlider.slick-initialized {
visibility: visible;
opacity: 1;
}
.behomeSlideItem{line-height: 0;}
.behomeSlideItem img{width: 100%;}
.behomeSlider::before{
position: absolute;
display: block;
content: '';
width: 30%;
height: 100%;
top: 0;
left: 0;
z-index: 1;
background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,0.4654236694677871) 0%, rgba(255,255,255,0) 100%);
}
.behomeSlider::after{
position: absolute;
display: block;
content: '';
width: 30%;
height: 100%;
top: 0;
right: 0;
z-index: 1;
background: rgb(0,0,0);
background: linear-gradient(270deg, rgba(0,0,0,0.4654236694677871) 0%, rgba(255,255,255,0) 100%);
}
.behome-cover .slick-prev,.behome-cover .slick-next{
position: absolute;
top: calc(50% - 70px);
z-index: 2;
display: block;
width: 50px;
height: 103px;
text-indent: -9999px;
border: 0;
cursor: pointer;
}
.behome-cover .slick-prev{
background: url(../images/ico-cover-left.png) center center no-repeat;
left: calc(50% - 590px);
}
.behome-cover .slick-next{
background: url(../images/ico-cover-right.png) center center no-repeat;
right: calc(50% - 590px);
}
.behome-cover .slick-dots {
list-style: none;
position: absolute;
bottom: 20px;
width: 100%;
display: flex;
justify-content: center;
margin: 0;
padding: 0;
}
.behome-cover .slick-dots li {
cursor: pointer;
display: inline-block;
width: 10px;
height: 10px;
border-radius: 10px;
overflow: hidden;
background: #663300;
margin: 0 3px;
}
.behome-cover .slick-dots li.slick-active{
background: #fde016;
}
.behome-cover .slick-dots li button{
display: none;
}
/* behome-section */
.behome-section{margin-bottom: 60px;}
.behome-section .container{display: flex;flex-direction: column;gap: 36px;}
/* behome-qc-full */
.behome-qc-full{display: flex;flex-direction: column;gap: 30px;align-items: center;line-height: 0;}
/*behome-layout*/
.behome-layout{display: flex;flex-direction: row;justify-content: space-between;gap: 36px;}
/* behome-cat-name */
.behome-cat-name{
    text-align: center;
    background: url(../images/behome-line.png) bottom center no-repeat;
    padding-bottom: 50px;
}
.behome-cat-title{
    display: inline-block;
    padding: 0 10px;
    background: url(../images/behome-oval.png) 0 0 no-repeat;
}
.behome-cat-title span:first-child{
    font: 100 45px/1.3 BeHome;
    color: #6d6d6d;
    margin-right: 10px;
}
.behome-cat-title span:not(:first-child){
    font: 700 32px/1.3 Inter;
    color: #663300;
}
/* behome-items */
.behome-ideas{
    font-weight: 100;
    font-size: 32px;
    color: #663300;
    margin: 0;
}
.behome-ideas span{
    font-weight: 300;
}
.behome-line{
    border-top: 1px solid #ffcc66;
    width: 80px;
}
.behome-thumb{
    width: calc(50% - 25px);
    position: relative;
    margin-top: 20px;
}
.behome-thumb::before {
    display: block;
    content: '';
    border: 1px solid #eaeaea;
    aspect-ratio: 4 / 3;
    position: absolute;
    width: 100%;
    top: -25px;
    right: -25px;
    z-index: 1;
}
.behome-thumb.lt::before{
    left: -25px;
}
.behome-thumb::after{
    display: block;
    content: '';
    border: 1px solid #ceced0;
    aspect-ratio: 4 / 3;
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 3;
    width: calc(100% - 20px);
    height: calc(100% - 25px);
}
.behome-thumb img {
    width: 100%;
    aspect-ratio: 4 / 3;
    position: relative;
    z-index: 2;
}
.behome-desc{
    width: calc(50% - 25px);
    line-height: 1.6;
}
.behome-desc p img:not(:first-child){
    margin-left: 20px;
}
.behome-book{
    display: inline-block;
    padding: 10px 20px;
    background: #663300;
    border-radius: 25px;
    color: #fff;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.1;
}
/* behome-slogan */
.behome-slogan{
    background: #dac0a6;
    padding: 20px;
}
.behome-slogan-content{
    border: 1px solid #fff;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.behome-slogan-content p{
    margin: 0;
}
.behome-slogan-content p:last-of-type{
    font-weight: 300;
    font-size: 18px;
    color: #663300;
}
/* behome-why */
.behome-why{
    background: #b59779;
    counter-reset: section;
}
.behome-why .container{
    position: relative;
}
.why-thumb{
    width: 605px;
    float: left;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    position: relative;
}
.why-desc{
    width: 550px;
    float: right;
}
.why-service{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 105px;
    background: #fde016;
    color: #3d1d08;
    font-size: 16px;
    font-weight: 300;
}
.why-service:before {
    content: '';
    display: block;
    counter-increment: section;
    content: "0" counter(section);
    width: 240px;
    display: block;
    float: left;
    text-align: left;
    font: 700 180px / 160px BeHomeNo;
}
.why-service h3{
    font-weight: 700;
    font-size: 22px;
    text-transform: uppercase;
    margin: 25px 0 0 0;
}
.why-service p{
    margin: 10px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.why-desc {
    width: 560px;
    float: right;
    border: 1px solid #cbb6a1;
    height: 310px;
    display: block;
    padding: 15px 20px;
    margin-top: 15px;
    font-weight: 300;
    line-height: 1.6;
}
.why-desc h4 {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}
.behome-book-why{
    background: #fde016;
    color: #3d1d08;
    font-size: 14px;
}
.behome-why-slider {
    visibility: hidden; 
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.behome-why-slider.slick-initialized {
    visibility: visible;
    opacity: 1;
}
.behome-why .slick-dots {
    list-style: none;
    position: absolute;
    bottom: 30px;
    right: 30px;
    display: flex;
    margin: 0;
    padding: 0;
}
.behome-why .slick-dots li {
    cursor: pointer;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    overflow: hidden;
    background: #909090;
    margin: 0 3px;
}
.behome-why .slick-dots li.slick-active{
    background: #fde016;
}
.behome-why .slick-dots li button{
    display: none;
}
/* behome-services */
.service-item{
    width: 50%;
    float: left;
}
.service-item:nth-child(1),.service-item:nth-child(2){
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 1px solid #ebebeb;
}
.service-item:nth-child(2n+1){
    padding-right: 40px;
}
.service-item:nth-child(2n+2){
    padding-left: 40px;
}
.service-thumb{
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    position: relative;
    overflow: hidden;
}
.service-thumb img{
    width: 100%;
    min-height: 100%;
}
.service-title {
    position: relative;
    display: flex;
    align-items: center;
    width: calc(100% - 220px);
    margin: -53px auto 30px auto;
    background: #b59779;
    padding: 10px;
    font-size: 12px;
    font-weight: 400;
    color: #fde016;
    text-align: center;
    text-transform: uppercase;
}
.service-title::before{
    content: '';
    display: block;
    border-top: 1px solid #ffcc66;
    width: 65px;
    position: absolute;
    left: -110px;
    bottom: 0;
}
.service-title a {
    display: flex;
    width: 100%;
    border: 1px solid #c4ac94;
    height: 86px;
    justify-content: center;
    align-items: center;
}
.service-title a:hover{
    color: #fff !important;
}
.service-desc{
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 30px;
}
.service-desc p:first-child{
    margin-top: 0;
}
.service-desc p:last-of-type{
    margin-bottom: 0;
}
.service-link {
    font-size: 14px;
    font-weight: 700;
    display: block;
    border-top: 1px solid #c2c2c2;
    border-bottom: 1px solid #c2c2c2;
    text-transform: uppercase;
    float: right;
    padding: 5px 15px 5px 0;
    background: url(../images/ico-service-arr.png) right center no-repeat;
}
/* behome-project */
.behome-project .container{
    width: 1200px;
}
.behome-project-slider {
    visibility: hidden; 
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.behome-project-slider.slick-initialized {
    visibility: visible;
    opacity: 1;
}
.project-item{
    aspect-ratio: 4 / 3;
    padding: 10px;
    position: relative;
    line-height: 0;
}
.project-item::before {
    content: '';
    display: block;
    width: calc(100% - 40px);
    aspect-ratio: 4 / 3;
    height: 190px;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 1;
    border: 1px solid #ffffff87;
}
.project-item img{
    aspect-ratio: 4 / 3;
    width: 100%;
}
.behome-project .slick-dots {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
    text-align: center;
}
.behome-project .slick-dots li {
    cursor: pointer;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    overflow: hidden;
    background: #909090;
    margin: 0 3px;
}
.behome-project .slick-dots li.slick-active{
    background: #fde016;
}
.behome-project .slick-dots li button{
    display: none;
}
/* behome-before-after */
.behome-before-after-content {position: relative;width: 100%;max-width: 100%;margin: auto;}
.before-after {position: relative;width: 100%;height: 600px;overflow: hidden;}
.before-after img {position: absolute;width: 100%;height: auto;object-fit: cover;}
.before-after img:first-child{z-index: 2;clip-path: inset(0 50% 0 0);}
.before-after img:not(:first-child) {z-index: 1;}
.before-after-slider {position: absolute;top: 0;bottom:0;left: 50%;width: 4px;height: 100%;background: #fff;cursor: ew-resize;z-index: 3;transform: translateX(-50%);}
.before-after-slider::before {content: "";position: absolute;top: 50%;left: -25px;width: 55px;height: 55px;background: url(../images/ico-before-after.png) center center no-repeat;border-radius: 50%;transform: translateY(-50%);box-shadow: 0 0 5px rgba(0,0,0,0.5);}
/* behome-blog */
.blog-item{width: calc((100% - 60px) / 4);float: left;}
.blog-item:not(:first-child){margin-left: 20px;}
.blog-thumb{display: block;width: 100%;position: relative;aspect-ratio: 4 / 3;overflow: hidden;margin-bottom: 15px;}
.blog-thumb img{width: 100%;aspect-ratio: 4 / 3;}
.blog-thumb::before {content: '';display: block;width: calc(100% - 20px);aspect-ratio: 4 / 3;height: 190px;position: absolute;top: 10px;left: 10px;z-index: 1;border: 1px solid #ffffff87;}
.blog-title{margin: 0 0 15px 0;font-size: 14px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;line-clamp: 2;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.blog-desc{color: #666;margin-bottom: 20px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;line-clamp: 3;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
/* behome-project-list */
.behome-project-list .project-item{width: calc((100% - 60px) / 4);float: left;margin: 0 0 20px 20px;padding: 0;}
.behome-project-list .project-item:nth-child(4n+1){margin-left: 0;clear: both;}
.behome-project-list .project-item::before {width: calc(100% - 20px);top: 10px;left: 10px;height: 195px;}
/* behome-nav */
.behome-nav{background: #110202;}
.behome-nav .container{background: url(../images/bg-nav.png) right center no-repeat;display: flex;align-items: center;gap: 20px;padding: 30px 0;}
.behome-nav h1{margin: 0;}
.behome-nav .container > :first-child {font-size: 30px;font-weight: 700;display: flex;align-items: center;gap: 20px;}
.behome-nav .container > :not(:first-child){font-size: 14px;}
.behome-nav .container > :first-child::after {content: '';display: flex;width: 5px;height: 36px;background: #fde016;}
.behome-nav a{color: #fde016;font-weight: 700;text-transform: uppercase;}
/* behome-policy */
.behome-policy .container{display: flex;align-items: center;gap: 45px;padding: 30px 0;font-weight: 300;text-transform: uppercase;color: #585858;background: url(../images/bg-policy.png) left bottom repeat-x;}
.policy-item {display: flex;gap: 15px;align-items: center;}
.policy-item:not(:first-child){background: url(../images/bd-policy.png) left center no-repeat;padding-left: 25px;}
/* behome-breadcrumbs */
.behome-breadcrumbs .container{display: flex;gap: 10px;align-items: center;padding: 15px 0;font-size: 12px;text-transform: uppercase;color: #d2d2d2;}
.behome-breadcrumbs .container :first-child{display: flex;align-items: center;gap: 10px;}
.behome-breadcrumbs .container :first-child::before{content: '';display: flex;width: 6px;height: 6px;background: #d2d2d2;}
.behome-breadcrumbs .container a:not(:first-child){display: flex;align-items: center;gap: 10px;}
.behome-breadcrumbs .container a:not(:first-child)::before{content: '/';display: flex;}
/* behome-slogan-special */
.behome-slogan-special-content > :first-child {color: #3d1d08;font-weight: 700;font-size: 18px;display: flex;justify-content: space-between;align-items: center;background: url(../images/ico-slogan-quote.png) right 12px no-repeat;padding-right: 140px;}
.behome{font-size: 38px;}
.behome-slogan-special-content > :first-child p{margin: 0;}
.behome-slogan-special-content > :first-child p:first-child{display: flex;align-items: center;gap: 30px;}
.behome-slogan-special-content > :first-child p:not(:first-child){font-weight: 300;color: #663300;}
.behome-slogan-special-content > :nth-child(2){font-family: BeHome;font-size: 50px;color: #6a79f8;}
.slogan-special-link{margin-top: 30px;float: right;}
/* __MB_ARTICLE_PAGING */
.__MB_ARTICLE_PAGING{display: flex;flex-direction: row;gap: 10px;align-items: center;justify-content: center;margin-top: 30px;}
.__MB_ARTICLE_PAGING::after{display: none;}
.__MB_ARTICLE_PAGING a, .__MB_ARTICLE_PAGING span {display: inline-block;padding: 10px 20px;background: #663300;border-radius: 25px;color: #fff;text-transform: uppercase;font-size: 15px;font-weight: 700;line-height: 1.1;}
.__MB_ARTICLE_PAGING span:first-child{display: none;}
.__MB_ARTICLE_PAGING .current{background: #999;}
.__MB_ARTICLE_PAGING a:hover{color: #fff !important;opacity: 0.8;}
/* behome-service-detail */
.service-cat-name {
    font-size: 28px;
    text-transform: uppercase;
    color: #080c27;
    font-weight: 700;
    text-align: center;
    display: flex;
    justify-content: center;
    white-space: nowrap;
    margin-bottom: 30px;
}
.service-cat-name::after{display: none;}
.service-cat-title {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    gap: 20px;
    padding: 20px 20px 0 20px;
    background: url(../images/behome-oval.png) 10px 10px no-repeat;
}
.service-cat-title::after{
    content: '';
    display: flex;
    border-bottom: 1px solid #252525;
    width: 180px;
    margin: auto;
}
.service-detail-content{font-size: 16px;line-height: 1.6;}
.service-detail-content h4{font-size: 28px;font-weight: 400;}
.service-detail-content p,.service-detail-content ul,.service-detail-content h4{margin: 0 0 30px 0;}
.service-detail-content ul.service-categories {
    padding: 0;
    list-style: none;
    display: inline-flex;
    flex-direction: column;
    gap: 1px;
}
.service-detail-content ul.service-categories li {
    padding: 15px 25px;
    background: #ebebeb;
    display: flex;
    border-radius: 5px;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}
.service-detail-content ul.service-categories li:hover{
    background: #dac0a6;
}
.service-detail-content ul.service-categories li::after{
    content: '';
    display: flex;
    width: 21px;
    height: 21px;
    background: url(../images/ico-plus.png) center center no-repeat;
}
.service-detail-content ul.service-categories li p{margin: 0;}
/* behome-service-slider */
.behome-service-slider {
    visibility: hidden; 
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    width: 1220px;
    margin-left: -20px;
}
.behome-service-slider.slick-initialized {
    visibility: visible;
    opacity: 1;
}
.behome-service-item{
    aspect-ratio: 1 / 1;
    padding: 0 20px;
    position: relative;
    line-height: 0;
}
.behome-service-item::before {
    content: '';
    display: block;
    width: calc(100% - 60px);
    aspect-ratio: 1 / 1;
    height: 245px;
    position: absolute;
    top: 10px;
    left: 30px;
    z-index: 1;
    border: 1px solid #ffffff87;
}
.behome-service-item img{
    aspect-ratio: 1 / 1;
    width: 100%;
    object-fit: cover;
}
.behome-service-item .service-link {
    position: absolute;
    bottom: 70px;
    z-index: 1;
    line-height: initial;
    float: none;
    left: calc(50% - 61px);
    padding: 5px 30px 5px 12px;
    border-top: 1px solid #fde016;
    border-bottom: 1px solid #fde016;
    background: #a1816b url(../images/ico-service-arr.png) right 10px center no-repeat;
    color: #3d1d08;
}
.behome-service-slider .slick-dots {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
.behome-service-slider .slick-dots li {
    cursor: pointer;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    overflow: hidden;
    background: #909090;
    margin: 0 3px;
}
.behome-service-slider .slick-dots li.slick-active{
    background: #fde016;
}
.behome-service-slider .slick-dots li button{
    display: none;
}
/* behome-process */
.tabs {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 20px;
}
.tab-item {
    padding: 10px 20px;
    background: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    color: #663300;
    border-radius: 20px;
    transition: all 0.3s;
}
.tab-item.active {
    background: #663300;
    color: #fff;
}
.tab-content {
    display: none;
    background: #f8f7f3;
    padding: 10px;
    margin: auto;
}

.tab-content.active {
    display: block;
}
.tab-container{
    border: 1px solid #e9e4dd;
    padding: 30px 10px;
}
.tab-heading{
    font-size: 24px;
    font-weight: 700;
    color: #663300;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
}
.tab-heading span{
    display: inline-block;
}
.tab-heading span::after{
    content: '';
    display: block;
    width: 80%;
    border-top: 1px solid #663300;
    margin: 15px auto 0 auto;
}
.panel-item {
    width: calc((100% - 60px) / 3);
    float: left;
    margin: 30px 0 0 30px;
    display: flex;
    gap: 10px;
}
.panel-item:nth-child(3n+1){
    margin-left: 0;
    clear: both;
}
.panel-item > div:not(:first-child){
    min-width: 110px;
}
.panel-item > div:first-child{
    color: #a1816a;
    text-align: right;
}
.panel-item > div:first-child p b{
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    color: #663300;
}


/* behome-blog-listing */
.behome-section.behome-blog-listing .container{display: block;}
.blog-menu{width: 300px;float: left;background: #f7f7f7;border: 1px solid #f4f4f4;}
.blog-menu a{display: flex;padding: 20px 25px;font-weight: 700;color: #080c27;text-transform: uppercase;}
.blog-menu a:not(:first-child){border-top: 1px solid #f4f4f4;}
.blog-menu a:hover,.blog-menu a.active{background: url(../images/bg-blog-menu.png) top center repeat-y;}
.blog-menu a::before {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    background: #663300;
    position: relative;
    top: 7px;
    margin-right: 20px;
}
.blog-listing{width: calc(100% - 340px);float: right;padding-right: 200px;}
.blog-listing .article{width: 100%;float: left;}
.blog-listing .article:not(:first-child){padding-top: 30px;margin-top: 30px;border-top: 1px solid #eaeaea;}
.blog-listing .article-image{width: 224px;float: left;margin-right: 30px;}
.blog-listing .article-image::after {content: '';display: block;width: calc(100% - 16px);aspect-ratio: 3 / 2;height: 132px;position: absolute;top: 8px;left: 8px;z-index: 1;border: 1px solid #ffffff87;border-radius: 4px;}
.blog-listing .article-desc{margin-top: 10px;-webkit-line-clamp: 2}
/* behome-blog-detail */
.behome-blog-detail .container{padding: 0 200px 0 300px;border-bottom: 1px solid #eaeaea;margin-bottom: 40px;}
.article-detail-title{font-size: 36px;font-weight: 700; margin: 0 0 30px 0;}
.behome-detail-desc{font-weight: 700;margin-bottom: 30px;}
.behome-detail-meta{font-size: 14px;}
#__MB_MASTERCMS_EL_3{line-height: 1.6;}
#__MB_MASTERCMS_EL_3 p{margin-bottom: 30px;}
.article-detail-source{font-size: 16px;text-align: right;}
/* article-detail-button */
.article-detail-button{display: flex;flex-direction: column;gap: 8px;position: sticky;top: 60px;}
.article-detail-button > div,.article-detail-button > a,.hna-btn-follow{display: flex;width: 32px;height: 32px;align-items: center;justify-content: center;border: 1px solid #ebebeb;border-radius: 32px;cursor: pointer;color: #555;}
.article-detail-button img{filter: opacity(0.5);}
.hna-btn-size{height: 110px !important;position: relative;}
.hna-btn-size-text > span{font-size: 20px;}
.hna-btn-size-plus,.hna-btn-size-minus{display: flex;width: 26px;height: 26px;align-items: center;justify-content: center;border: 1px solid #ebebeb;border-radius: 26px;font-size: 12px;}
.hna-btn-size-plus{position: absolute;top: 2px;}
.hna-btn-size-minus{position: absolute;bottom: 2px;}
.tooltip {position: relative;}
.tooltip .tooltiptext {visibility: hidden;width: 140px;background-color: #555;color: #fff;text-align: center;border-radius: 6px;padding: 5px;position: absolute;z-index: 1;bottom: 150%;left: 50%;margin-left: -75px;opacity: 0;transition: opacity 0.3s;}
.tooltip .tooltiptext::after {content: "";position: absolute;top: 100%;left: 50%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #555 transparent transparent transparent;}
.tooltip:hover .tooltiptext {visibility: visible;opacity: 1;}
/* behome-detail-hashtag */
.behome-detail-hashtag{display: flex;flex-direction: column;gap: 15px;padding: 20px 0 10px 0;border-top: 1px solid #ebebeb;border-bottom: 1px solid #ebebeb;}
.behome-tag-title{display: flex;flex-direction: row;gap: 10px;font-size: 20px;height: 20px;align-items: center;text-transform: uppercase;}
.behome-tag-content a{display: inline-flex;height: 40px;align-items: center;padding: 0 20px;border-radius: 20px;background: #ebebeb;font-size: 16px;margin-bottom: 10px;}
/* behome-detail-relate */
.behome-detail-relate .behome-heading {background-image: url(../images/icon/icon-border-cat-red.png);padding-left: 25px;color: initial;}
/* behome-detail-other */
.behome-detail-other .behome-heading {background-image: url(../images/icon/icon-border-cat-red.png);padding-left: 25px;color: initial;}
/* user-comment */
#user-comment .behome-heading {background-image: url(../images/icon/icon-border-cat-red.png);padding-left: 25px;color: initial;}
/* footer */
.footer{background: #f7f7f7;color: #616161;}
.footer-center > .container{display: flex;gap: 40px;flex-direction: row;justify-content: space-between;padding: 35px 0;}
.footer-center > .container > div:first-child{display: flex;min-width: 80px;justify-content: start;}
.footer-center > .container > div p:first-child{margin-top: 0;}
.footer-center > .container > div p:first-child b{color: #000;}
/* scrollToTop */
#scrollToTop {display: none;position: fixed;bottom: 20px;right: 30px;z-index: 99;cursor: pointer;}
/* mastercms */
.mastercms > .container{padding: 15px 0;color: #999;font-size: 13px;}

@font-face {font-family: Inter;src: url(fonts/Inter/Inter-Bold.ttf);font-weight: 700;font-display: swap;}
@font-face {font-family: Inter;src: url(fonts/Inter/Inter-Regular.ttf);font-weight: 400;font-display: swap;}
@font-face {font-family: Inter;src: url(fonts/Inter/Inter-Light.ttf);font-weight: 300;font-display: swap;}
@font-face {font-family: Inter;src: url(fonts/Inter/Inter-Thin.ttf);font-weight: 100;font-display: swap;}
@font-face {font-family: BeHome;src: url(fonts/UTM-AS-Heartbeat.ttf);font-weight: 100;font-display: swap;}
@font-face {font-family: BeHomeNo;src: url(fonts/Bai_Jamjuree/BaiJamjuree-Bold.ttf);font-weight: 700;font-display: swap;}