
.not-active.headroom--pinned {
    opacity: 1 !important;
	top: 0px !important;
	background: #fff;

    -webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.not-active.headroom--pinned .header-menu-switch {
    border: 1px solid  rgba(20, 26, 35, 0.5);
}

.not-active.headroom--pinned .header-menu-line {
    background: #131922;

    -webkit-transition: -webkit-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-moz-transition: -moz-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-ms-transition: -ms-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	transition: transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
}

.not-active.headroom--pinned .header-lang-item {
    color: #131922;
}

.not-active.headroom--pinned .header-lang-item:first-child:after {
    background: #131922;
}

.not-active.headroom--pinned .header-logo:before {
    opacity: 0;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}

.not-active.headroom--pinned .header-logo:after {
    opacity: 1;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}


.not-active.headroom--unpinned {
    opacity: 0 !important;
	top: -90px !important;

    -webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.not-active.nav-opened .headroom--unpinned {
	opacity: 1 !important;
	top: 0px !important;
	background: #fff !important;

	-webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.not-active.headroom--top {
	opacity: 1 !important;
	top: 0px !important;
	background: transparent !important;

    -webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.not-active.headroom--top .header-menu-switch {
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.not-active.headroom--top .header-menu-line {
    background: #fff;

    -webkit-transition: -webkit-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-moz-transition: -moz-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-ms-transition: -ms-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	transition: transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
}

.not-active.headroom--top .header-lang-item {
    color: #fff;
}

.not-active.headroom--top .header-lang-item:first-child:after {
    background: #fff;
}

.not-active.headroom--top .header-logo:before {
    opacity: 1 !important;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}

.not-active.headroom--top .header-logo:after {
    opacity: 0 !important;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}

.active.headroom--top {
	opacity: 1 !important;
	top: 0px !important;
	background: transparent !important;

    -webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.active.headroom--top .header-menu-switch {
    border: 1px solid  rgba(20, 26, 35, 0.5);
}

.active.headroom--top .header-menu-line {
    background: #131922;

    -webkit-transition: -webkit-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-moz-transition: -moz-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-ms-transition: -ms-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	transition: transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
}

.active.headroom--top .header-lang-item {
    color: #131922;
}

.active.headroom--top .header-lang-item:first-child:after {
    background: #131922;
}

.active.headroom--top .header-logo:before {
    opacity: 0;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}

.active.headroom--top .header-logo:after {
    opacity: 1;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}



.not-active.headroom--not-top {
	background: transparent !important;
	/* background: #fff; */

    -webkit-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -moz-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    -ms-transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
    transition: opacity 0.6s, top 0.6s, background 0.6s, left 0.6s;
}

.not-active.headroom--not-top .header-menu-switch {
    border: 1px solid  rgba(20, 26, 35, 0.5);
}

.not-active.headroom--not-top .header-menu-line {
    background: #131922;

    -webkit-transition: -webkit-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-moz-transition: -moz-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	-ms-transition: -ms-transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
	transition: transform 0.6s, top 0.6s, opacity 0.6s, background 0.6s, width 0.6s;
}

.not-active.headroom--not-top .header-lang-item {
    color: #131922;
}

.not-active.headroom--not-top .header-lang-item:first-child:after {
    background: #131922;
}

.not-active.headroom--not-top .header-logo:before {
    opacity: 0;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}

.not-active.headroom--not-top .header-logo:after {
    opacity: 1;

    -webkit-transition: opacity 0.6s;
    -moz-transition: opacity 0.6s;
    -ms-transition: opacity 0.6s;
    transition: opacity 0.6s;
}



.nav-opened .headroom--not-top {
	/* background: #fff !important; */
    background: transparent !important;
	/* background: #fff; */

	-webkit-transition: background 0.6s;
	-moz-transition: background 0.6s;
	-ms-transition: background 0.6s;
	transition: background 0.6s;
}


.hm-top-container {
    position: relative;

    /* position: fixed; */
    /* top: 0px; */
    /* left: 0px; */

    display: block;
    width: 100%;
    height: 100vh;
    z-index: 2;
}

#video-viewport {
    position: absolute;
    top: 0;
    overflow: hidden;
}

#debug {
    position: absolute;
    display: none;
    top: 0;
    z-index: 100;
    color: #fff;
    font-size: 12pt;
}

.video-black-op {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.3);
}

.hm-top-content {
    position: absolute;
    display: block;
    left: 80px;
    bottom: 65px;
    /* bottom: 84px; */
    /* top: calc(100% - 115px); */
    color: #fff;
}

.hm-top-title {
    position: relative;
    display: block;
    font-size: 43px;
    line-height: 45px;
    letter-spacing: 4px;
    margin: 0px 0px 15px;
}

.hm-top-title.ch {
    font-size: 32px;
    letter-spacing: 7px;
}

.solid-mahogany-text {
    position: relative;
    display: block;
    width: 536px;
    margin-bottom: 30px;
}

.solid-mahogany-text.ch {
    width: 264px;
}

.hm-top-desc {
    position: relative;
    display: block;
    padding-top: 20px;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 1px;
    margin-bottom: 30px;
}

.hm-top-arrow {
    position: relative;
    display: block;
    width: 7px;
    height: 43px;
    overflow: hidden;
}

.hm-top-arrow::before {
    content: '';
    position: absolute;
    display: block;
    width: 1px;
    height: 100%;
    left: 3px;
    top: -100%;
    background: #fff;

    animation: topArrowBf 5s infinite;
    animation-delay: 2s;
}

@keyframes topArrowBf {
    0%
    {
        top: -100%;
    }
    30%
    {
        top: 0%;
    }
    70%
    {
        top: 0%;
    }
    100%
    {
        top: 110%;
    }
}

.hm-top-arrow::after {
    content: '';
    position: absolute;
    display: block;
    width: 5px;
    height: 5px;
    left: 1px;
    bottom: calc(100% + 1px);
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;

    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);

    animation: bottomArrowAf 5s infinite;
    animation-delay: 2s;
}

@keyframes bottomArrowAf {
    0%
    {
        bottom: calc(100% + 1px);
    }
    30%
    {
        bottom: 1px;
    }
    70%
    {
        bottom: 1px;
    }
    100%
    {
        bottom: -110%;
    }
}

/* .hm-top-desc:before {
    content: '';
    position: absolute;
    display: block;
    height: 1px;
    width: 275px;
    top: 0px;
    left: 0px;
    background: rgba(255, 255, 255, 0.5);
} */

.hm-about {
    position: relative;
    background: #fff;
    /* position: absolute; */
    /* height: 100vh; */
    /* top: 100vh; */
    /* left: 0px; */

    display: block;
    padding: 225px 0px 225px 220px;
}

.hm-about-before {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0px;
    /* top: 0px; */
    background: url('../../img/front/home/featured_product.jpg') no-repeat;
    background-position: right 60px center !important;
    background-size: 752px auto !important;
}

.hm-about-content {
    position: relative;
    display: table;
    padding-top: 100px;
    z-index: 10;
    max-width: 400px;
}

.hm-about-content > * {
    z-index: 1;
}

.hm-about-content-before {
    position: absolute;
    display: block;
    width: 200px;
    height: 200px;
    background: url('../../img/front/home/wood_pattern1.svg') no-repeat;
    background-position: 50% !important;
    background-size: contain !important;
    left: -115px;
    top: -100px;
}

.hm-about-content-after {
    position: absolute;
    display: block;
    width: 80px;
    height: 80px;
    background: url('../../img/front/home/wood_pattern2.svg') no-repeat;
    background-position: 50% !important;
    background-size: contain !important;
    /* right: -62px; */
    left: 295px;
    top: auto !important;
    bottom: -60px;
}

.hm-about-li {
    position: relative;
    display: block;
    font-size: 14px;
    padding-left: 12px;
    line-height: 14px;
    margin-bottom: 20px;
    letter-spacing: 1px;
}

.hm-about-li:before {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #131922;
    left: 0px;
    top: calc((100% - 4px) / 2);
}

.hm-about-title {
    position: relative;
    display: block;
    font-size: 36px;
    line-height: 50px;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.hm-about-desc {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.3px;
    letter-spacing: 1px;
    /* padding-bottom: 25px; */
    margin-bottom: 20px;
}

/* .hm-about-desc:after {
    content: '';
    position: absolute;
    display: block;
    width: 135px;
    height: 1px;
    background: #131922;
    left: 0px;
    bottom: 0px;
} */

.hm-about-link-group {
    position: relative;
    display: table;
    font-size: 0px;
    padding-top: 20px;
}

.hm-about-link-group:after {
    content: '';
    position: absolute;
    display: block;
    width: calc(100% + 25px);
    height: 1px;
    background: #131922;
    left: 0px;
    top: 0px;
}

.hm-about-link-group > * {
    font-size: 14px;
}

.hm-about-link-side {
    position: relative;
    display: inline-block;
    vertical-align: top;
}

.hm-about-link-side:first-child {
    margin-right: 125px;
}

.hm-about-link {
    position: relative;
    display: table;
    line-height: 14px;
    /* margin-bottom: 18px; */
    letter-spacing: 1px;
    /* color: #a6a7a9; */
    color: #131922 !important;
/*
    -webkit-transition: color 0.6s;
    -moz-transition: color 0.6s;
    -ms-transition: color 0.6s;
    transition: color 0.6s; */
}
/*
.hm-about-link:hover {
    color: #131922;

    -webkit-transition: color 0.6s;
    -moz-transition: color 0.6s;
    -ms-transition: color 0.6s;
    transition: color 0.6s;
} */

.hm-about-link:after {
    content: '';
    position: absolute;
    display: block;
    width: 14px;
    height: 14px;
    right: -25px;
    /* right: 25px; */
    /* opacity: 0; */
    top: 1px;
    background: url('../../img/front/home/right_arrow.svg') no-repeat;
    background-size: contain !important;
    background-position: 50% !important;

    -webkit-transition: right 0.6s;
    -moz-transition: right 0.6s;
    -ms-transition: right 0.6s;
    transition: right 0.6s;
}

.hm-about-link:hover:after {
    right: -35px;

    -webkit-transition: right 0.6s;
    -moz-transition: right 0.6s;
    -ms-transition: right 0.6s;
    transition: right 0.6s;
}

.hm-product-desk {
    display: block !important;
}

.hm-product-tab {
    display: none !important;
}

.hm-product-mob {
    display: none !important;
}

.hm-product {
    position: relative;
    /* position: absolute; */
    /* height: 100vh; */
    /* top: 100vh; */
    /* left: 0px; */

    display: block;
    text-align: center;
    font-size: 0px;
    /* padding: 0px 108px 100px; */
    width: calc(100% - 100px);
    max-width: 1320px;
    margin: 0px auto 150px;
}

.hm-product > * {
    font-size: 14px;
}

.hm-product-item {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: calc((100% - (24px * 2)) / 3);
    margin: 0px 12px;
}

.hm-product-item li {
    width: 100%;
    height: 519px;

    background-size: contain !important;
    background-position: 50% !important;
}

.hm-product-item:first-child {
    margin-left: 0px;
}

.hm-product-item:last-child {
    margin-right: 0px;
}

.hm-how {
    position: relative;
    display: block;
    font-size: 0px;
    padding: 150px 0px;
    /* padding: 50px 0px; */
    background: #e5f1eb;
    /* width: calc(100% - 100px); */
    /* max-width: 1320px; */
    margin: 0px auto 150px;
}

.hm-how > * {
    font-size: 14px;
}

.hm-how-image-wrap {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: calc(100vw - 668px);
}

.hm-how-image-wrap img {
    width: 100%;
}

.hm-how-pattern-big {
    right: -25px;
    top: 35px !important;
    left: auto !important;
}

.hm-how-pattern-small {
    right: -40px;
    /* top: -35px; */
    top: auto;
    left: auto;
    bottom: -50px;
}

.hm-how-thumb-image {
    position: absolute;
    display: block;
    top: calc(100% + 100px);
    left: 0px;
}

.hm-about-content.hm-how-content {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 314px;
    margin-left: 135px;
}

.hm-business {
    position: relative;
    display: block;
    font-size: 0px;
    padding: 100px 0px;
    /* margin: 0px auto 150px; */
}

.hm-business > * {
    font-size: 14px;
}

.hm-about-content.hm-business-content {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 314px;
    margin-left: 220px;
    margin-right: 135px;
    padding-top: 200px;
}

.hm-business-image {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: calc(100vw - (314px + 220px + 135px));
}

.hm-business-image.mob {
    display: none;
}

.hm-about-content-before.hm-business-pattern-big {
    left: -100px;
    top: 180px;
}

.hm-about-content-after.hm-business-pattern-small {
    left: 140px;
    top: 110px;
}

.hm-article {
    position: relative;
    display: block;
    margin-bottom: 100px;
    padding-top: 50px;
    background: #fff;
}

.hm-article-title {
    position: relative;
    display: table;
    font-size: 19px;
    line-height: 19px;
    padding-bottom: 10px;
    text-align: center;
    margin: 0px auto 80px;
    border-bottom: 1px solid #131922;
    letter-spacing: 1px;
}

.hm-article-content {
    position: relative;
    display: block;
    font-size: 0px;
    text-align: center;
    width: calc(100% - 100px);
    max-width: 1320px;
    margin: 0px auto 90px;
}

.hm-article-content > * {
    font-size: 14px;
}

.hm-article-item {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0px 12px 24px;
    text-align: left;
    width: calc((100% - (24px * 2)) / 3);
    color: #131922 !important;
}

.hm-article-item:first-child {
    margin-left: 0px;
}

.hm-article-item:last-child {
    margin-right: 0px;
}

.hm-article-item-image {
    position: relative;
    display: block;
    width: 100%;
    margin: 0px auto 15px;
}

.hm-article-item-date {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 24px;
    opacity: 0.7;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
}

.hm-article-item-title {
    position: relative;
    display: block;
    font-size: 16px;
    letter-spacing: 0.8px;
    line-height: 24px;
}

.hm-article-more {
    position: relative;
    display: table;
    margin: 0px auto;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: 1px;
    color: #131922 !important;
}

.hm-article-more:after {
    content: '';
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 14px;
    height: 14px;
    background: url('../../img/front/home/right_arrow.svg') no-repeat;
    background-position: 50% !important;
    background-size: contain !important;
    margin-left: 7px;

    -webkit-transition: margin-left 0.4s;
    -moz-transition: margin-left 0.4s;
    -ms-transition: margin-left 0.4s;
    transition: margin-left 0.4s;
}

.hm-article-more:hover:after {
    margin-left: 14px;

    -webkit-transition: margin-left 0.4s;
    -moz-transition: margin-left 0.4s;
    -ms-transition: margin-left 0.4s;
    transition: margin-left 0.4s;
}

.hm-how-image-wrap.desk {
}

.hm-how-image-wrap.mob {
    display: none;
}


@media screen and (orientation : landscape) {

}

@media screen and (orientation : portrait) {

}

/* Desktops and laptops */
@media screen and (min-width : 1224px) {

}

@media screen and (max-width : 1400px) {
    .hm-about-before {
        background-size: 652px auto !important;
    }

    .hm-top-content {
        left: 50px;
    }
}

/* Tablet */
@media screen and (max-width: 1024px) {
    .hm-product-desk {
        display: none !important;
    }

    .hm-product-tab {
        display: block !important;
        margin: 0px auto 100px;
    }

    .hm-product-mob {
        display: none !important;
    }

    .hm-top-title {
        font-size: 35px;
        line-height: 40px;
    }

    .solid-mahogany-text {
        width: 460px;
    }

    .hm-about {
        padding: 50px 0px 80px 100px;
    }

    .hm-about-content-before {
        left: -130px;
        top: 0px;
    }

    .hm-about-before {
        background-size: 452px auto !important;
    }

    .hm-product-item {
        width: calc((100% - 24px) / 2);
        max-width: 424px;
    }

    .hm-how {
        padding: 100px 0px;
        margin-bottom: 0px;
    }

    .hm-how-image-wrap {
        width: calc(100vw - 500px);
    }

    .hm-about-content.hm-how-content {
        margin-left: 50px;
        padding-top: 20px;
    }

    .hm-how-thumb-image {
        display: none;
    }

    .hm-about-content.hm-business-content {
        margin-left: 135px;
        margin-right: 50px;
    }

    .hm-business-image {
        width: calc(100vw - (500px));
    }

    .hm-how-pattern-big {
        top: -85px !important;
    }

    .hm-about-content.hm-business-content {
        padding-top: 20px;
    }

    .hm-article-content {
        margin-bottom: 50px;
    }
}

/* Mobile */
@media screen and (max-width: 768px) {
    .hm-about {
        padding: 50px 0px 100px 0px;
    }

    .hm-about-content {
        width: calc(100% - 100px);
        padding-left: 80px;
        margin-bottom: 50px;
    }

    .hm-about-content-before {
        left: -50px;
    }

    .hm-about-content br {
        display: none;
        padding-top: 50px;
    }

    .hm-about-before {
        height: 452px;
        position: relative;
        display: block;
        background-position: 50% !important;
    }

    .hm-about-content-after {
        left: auto;
        right: 0px;
    }

    .hm-how {
        padding: 100px 0px 0px;
    }

    .hm-how-image-wrap {
        width: 100%;
        z-index: 1;
    }

    .hm-how-image-wrap.desk {
        display: none;
    }

    .hm-how-image-wrap.mob {
        display: block;
    }

    .hm-about-content.hm-how-content {
        padding: 0px 50px 100px;
        width: 100%;
        margin: 0px;
    }

    .hm-business {
        padding: 100px 0px 0px;
    }

    .hm-business-image {
        display: block;
        width: 100%;
        /* margin-bottom: 100px; */
    }

    .hm-about-content-before.hm-business-pattern-big {
        top: -170px;
    }

    .hm-about-content.hm-business-content {
        width: 100%;
        margin: 0px;
        padding: 0px 50px 100px;
    }

    .hm-why {
        padding-top: 100px;
    }

    .hm-article {
        padding-top: 100px;
    }
}

@media screen and (max-width : 500px) {
    .hm-top-container {
        margin-bottom: 100px;
    }

    .hm-top-content {
        left: 20px;
        bottom: 65px;
        width: calc(100% - 40px);
    }

    .hm-top-desc br {
        display: none;
    }

    .hm-top-title {
        font-size: 25px;
        line-height: 30px;
        margin-bottom: 10px;
    }

    .solid-mahogany-text {
        width: 300px;
        margin-bottom: 20px;
    }

    .hm-about {
        padding: 80px 0px 80px;
    }

    .hm-about-content {
        width: calc(100% - 40px);
        padding-left: 0px;
        margin: 0px auto 80px;
        padding-top: 0px;
    }

    .hm-about-content-before {
        top: -170px;
    }

    .hm-about-content-after.hm-business-pattern-small {
        bottom: -120px !important;
        left: -20px !important;
    }

    .hm-about-content-after {
        bottom: -470px !important;
        right: -40px !important;
    }

    .hm-about-before {
        height: 300px;
        width: calc(100% - 40px);
        margin: 0px auto;
        background-size: contain !important;
    }

    .hm-about-li {
        margin-bottom: 10px;
    }

    .hm-about-title {
        font-size: 30px;
        line-height: 45px;
    }

    .hm-product {
        width: calc(100% - 40px);
        margin-bottom: 80px;
    }

    .hm-product-desk {
        display: none !important;
    }

    .hm-product-tab {
        display: none !important;
    }

    .hm-product-mob {
        display: block !important;
    }

    .hm-product-item {
        width: 100%;
        margin: 0px auto;
    }

    .hm-product-item li {
        height: 480px;
    }

    .hm-how {
        padding: 80px 0px 0px;
        margin-bottom: 100px;
    }

    .hm-about-content.hm-how-content {
        padding: 0px 20px 60px;
    }

    .hm-about-content.hm-business-content {
        padding: 0px 20px 60px;
    }

    .hm-business {
        padding: 80px 0px 0px;
        margin-bottom: 100px;
    }

    .hm-why {
        padding-top: 80px;
        margin-bottom: 100px;
    }

    .hm-article {
        padding-top: 80px;
    }

    .hm-article-title {
        margin: 0px auto 50px;
    }

    .hm-article-content {
        width: calc(100% - 40px);
    }

    .hm-article-item {
        /* width: calc((100% - 10px) / 2); */
        width: 100%;
        margin: 0px 0px 70px;
    }

    .hm-article-item:last-child {
        margin-bottom: 30px;
    }
}
