.mb-banner {
    overflow: hidden
}

.mb-banner img {
    width: 100%
}

.mb-banner .slick-next,
.mb-banner .slick-prev {
    display: none
}

.mb-banner .slick-dots {
    bottom: 20px
}

.mb-banner .slick-dots li {
    margin: 0 4px;
    width: 14px;
    height: 14px;
    padding: 3px;
    border: 1px solid rgba(255, 255, 255, 0)
}

.mb-banner .slick-dots li button {
    background: #fff;
    width: 6px;
    height: 6px
}

.mb-banner .slick-dots li.slick-active {
    border: 1px solid #fff
}

.mb-banner .slick-dots li.slick-active button {
    background: #fff
}

.mb-point {
    padding: .6rem .15rem .4rem
}

.mb-point li {
    float: left;
    width: 25%;
    text-align: center
}

.mb-point li img {
    width: .8rem
}

.mb-point li span {
    display: block;
    margin-top: .4rem;
    font-size: .3rem
}

.mb-tit {
    text-align: center;
    color: #071e4d;
    position: relative;
    padding-top: 1.1rem;
    height: 2.49333333rem;
    line-height: .50666666rem
}

.mb-tit p {
    font-size: .4rem;
    font-weight: lighter;
    font-size: .4rem;
    text-transform: uppercase;
    position: relative;
    z-index: 1
}

.mb-tit h2 {
    font-size: .37333333rem;
    font-weight: 700;
    letter-spacing: .10666666rem;
    position: relative;
    z-index: 1
}

.mb-tit span {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    margin-left: -.38666666rem;
    display: inline-block;
    width: .78666666rem;
    height: 2.49333333rem;
    background-image: url(../img/home_tit_png.png);
    background-size: cover
}

.mb-des {
    margin-top: .13333333rem;
    text-align: center;
    font-size: .26666666rem;
    color: #664d02;
    font-weight: lighter
}

.mb-des span {
    position: relative
}

.mb-des span:after,
.mb-des span:before {
    position: absolute;
    top: 50%;
    content: "";
    width: .8rem;
    height: 1px;
    background: #8c6900
}

.mb-des span:before {
    left: -.93333333rem
}

.mb-des span:after {
    right: -.93333333rem
}

.mb-more {
    display: block;
    height: .8rem;
    line-height: .8rem;
    font-size: .29333333rem;
    color: #fff;
    background: #0a2444;
    text-align: center;
    letter-spacing: .04rem
}

.ny-tab {
    margin: .53333333rem -.4rem 0;
    text-align: center;
    font-size: 0
}

.ny-tab span {
    margin: 0 .16rem;
    display: inline-block;
    width: 2.05333333rem;
    padding: .2rem 0;
    border: 1px solid #ccc;
    font-size: .24rem;
    color: #555
}

.ny-tab span.active {
    background: #0083c7;
    border: 1px solid #0083c7;
    color: #fff
}

.mb-case {
    padding: .8rem .4rem 1.2rem
}

.mb-case .js-tab-con {
    display: none
}

.mb-case .js-tab-con.active {
    display: block
}

.mb-case .ny-tab span {
    margin-top: .16rem
}

.mb-case ul {
    margin: .53333333rem -2px 30px
}

.mb-case li {
    float: left;
    width: 50%;
    padding: 2px
}

.mb-case li .img-vertical i {
    padding-bottom: 67.021277%
}

.mb-case li p {
    font-size: .32rem;
    margin-top: .2rem;
    color: #333
}

.mb-case li .des {
    font-size: .26rem;
    margin-top: .13rem;
    text-align: center
}

.mb-designer {
    padding: 1.2rem .4rem 1rem;
    background-image: url(../img/mb_designer_bg.jpg)
}

.mb-designer .mb-tit {
    color: #fff
}

.mb-designer .mb-tit span {
    background-image: url(../img/home_tit_png2.png)
}

.mb-designer .mb-des {
    color: #fff
}

.mb-designer .mb-des span:after,
.mb-designer .mb-des span:before {
    background: #fff
}

.mb-designer .ny-tab span {
    color: #fff
}

.mb-designer .js-tab-con {
    display: none
}

.mb-designer .js-tab-con.active {
    display: block
}

.mb-designer ul {
    margin: .53333333rem 0 .4rem
}

.mb-designer li {
    float: left;
    width: 33.3333333333%
}

.mb-designer li .img-vertical i {
    padding-bottom: 100%
}

.mb-designer li .img-vertical img {
    bottom: auto;
    min-width: 100%;
    max-height: 1000%
}

.mb-softfitted {
    padding: 1.46666666rem .4rem 1rem
}

.mb-softfitted .content {
    margin: .33333333rem -.08rem
}

.mb-softfitted .content span {
    float: left;
    width: 33.3333333333%;
    display: block;
    padding: .08rem
}

.mb-softfitted .content span img {
    width: 100%
}

.mb-softfitted .content .big {
    width: 66.6%
}

.mb-softfitted .content .right {
    float: right;
    width: 33.3333333333%
}

.mb-softfitted .content .right span {
    width: 100%
}

.mb-hotcase {
    padding: .86666666rem 0 1.06666666rem;
    background-image: url(../img/mb_hotcase_bg.jpg)
}

.mb-hotcase .content {
    margin-top: .73333333rem;
    background: #fff
}

.mb-hotcase .img img {
    width: 100%
}

.mb-hotcase .img-vertical {
    padding-bottom: 67.021277%
}

.mb-hotcase .text {
    padding: .46666666rem .4rem .8rem
}

.mb-hotcase .text .tit span {
    float: left;
    width: 6rem;
    color: #111;
    font-size: .36rem;
    line-height: .9rem;
    display: block
}

.mb-hotcase .text .tit em {
    float: right;
    display: block;
    width: 2.58666666rem;
    border: 1px solid #0083c7;
    color: #0083c7;
    padding: .2rem 0;
    font-size: .26666666rem;
    text-align: center
}

.mb-hotcase .text .tip {
    margin-top: .46666666rem
}

.mb-hotcase .text .tip span {
    float: left;
    width: 27%;
    color: #777;
    font-size: .29333333rem;
    position: relative
}

.mb-hotcase .text .tip span:before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -.10666666rem;
    left: 0;
    width: 1px;
    height: .21333333rem;
    background: #dcdcdc
}

.mb-hotcase .text .tip span:nth-child(1):before {
    display: none
}

.mb-hotcase .text .tip span:nth-child(2) {
    text-align: center;
    width: 46%
}

.mb-hotcase .text .tip span:nth-child(3) {
    text-align: right
}

.mb-hotcase .text .tip span i {
    color: #0083c7;
    font-style: normal
}

.mb-hotcase .text .tip span em {
    position: relative;
    padding-left: .33333333rem
}

.mb-hotcase .text .tip span em:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: .26666666rem;
    height: .26666666rem;
    margin-top: -.13333333rem;
    background-size: cover;
    background-image: url(../img/mb_heart.png)
}

.mb-hotcase .more {
    padding: .4rem .4rem 0
}

.mb-order {
    padding: .86666666rem .4rem 1.06666666rem
}

.mb-order .mb-des {
    margin-bottom: .66666666rem
}

.mb-order .in {
    width: 100%;
    margin-bottom: .26666666rem;
    border: 1px solid #d9d9d9
}

.mb-order .in input {
    background: 0 0;
    border: none;
    width: 100%;
    height: 1rem;
    line-height: .8rem;
    padding: .1rem .2rem;
    font-size: .32rem;
    color: #999
}

.mb-order .in select {
    background: #fff;
    border: none;
    width: 100%;
    height: 1rem;
    line-height: .8rem;
    padding: .1rem .2rem;
    font-size: .32rem;
    color: #999
}

.mb-order .bt {
    position: relative
}

.mb-order .bt:after {
    position: absolute;
    top: .43rem;
    left: 5.5rem;
    content: "";
    height: 1.33333333rem;
    width: .93333333rem;
    background-image: url(../img/mb_head.png);
    background-size: cover
}

.mb-order .bt input {
    width: 100%;
    height: 1rem;
    line-height: 1rem;
    font-size: .4rem;
    color: #fff;
    background: #0a2444;
    letter-spacing: .08rem
}

.ny-mb-theme {
    text-align: center
}

.ny-mb-theme {
    padding-bottom: .4rem;
    position: relative
}

.ny-mb-theme:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -2.4rem;
    width: 4.8rem;
    height: 1px;
    background: #eee
}

.ny-mb-theme img {
    width: .68rem;
    display: inline-block;
    vertical-align: middle
}

.ny-mb-theme span {
    margin-left: .15rem;
    padding-left: .35rem;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: .42666666rem;
    color: #333;
    letter-spacing: .07rem
}

.ny-mb-theme span:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #0083c7
}

.ny-mb-theme p {
    margin-top: .2rem;
    letter-spacing: .13333333rem;
    font-size: .24rem
}

.ny-mb-theme span {
    margin-left: 0;
    padding-left: 0
}

.ny-mb-theme span:before {
    display: none
}

.mb-wholehouse-design {
    padding: 1.06666666rem .4rem 0
}

.mb-wholehouse-design .slick {
    margin: .66666666rem 0 .4rem
}

.mb-wholehouse-design .slick img {
    width: 100%
}

.mb-wholehouse-design .item {
    float: left;
    width: 48.5%;
    margin-right: 3%;
    position: relative
}

.mb-wholehouse-design .item span {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5px 20px;
    color: #fff;
    font-size: 12px;
    letter-spacing: 1px;
    background: rgba(16, 18, 40, .8)
}

.mb-wholehouse-design .item:last-child {
    margin-right: 0
}

.mb-wholehouse-design .slick-prev {
    background-color: #fff;
    background-image: url(../img/slick_prev_black.png)
}

.mb-wholehouse-design .slick-next {
    background-color: #fff;
    background-image: url(../img/slick_next_black.png)
}

.mb-budget {
    padding: 1.46666666rem .4rem 0
}

.mb-budget ul {
    margin-top: .73333333rem
}

.mb-budget li {
    margin-bottom: .33333333rem;
    border: 1px solid #eee
}

.mb-budget li .text {
    padding: .33333333rem .53333333rem .33333333rem
}

.mb-budget li .text span {
    display: block;
    font-size: .32rem;
    color: #333;
    letter-spacing: .06666666rem
}

.mb-budget li .text p {
    margin-top: .12rem;
    color: #ccc;
    font-size: .16rem;
    text-transform: uppercase
}

.mb-budget li .text div {
    margin-top: .17rem;
    font-size: .24rem;
    line-height: .4rem;
    color: #777
}

.mb-golden {
    padding: 1.46666666rem .4rem .8rem
}

.mb-golden .des {
    margin: .4rem 0 .66666666rem;
    font-size: .24rem;
    line-height: .42666666rem;
    text-align: center
}

.mb-golden .des .img {
    padding: 0 .4rem
}

.line {
    background: #ededed;
    width: 100%;
    height: .2rem;
    -webkit-box-shadow: 0 0 .06666666rem rgba(26, 24, 24, .1) inset;
    box-shadow: 0 0 .06666666rem rgba(26, 24, 24, .1) inset
}

.mb-enjoy {
    padding: 1.13333333rem .4rem 1.2rem
}

.mb-enjoy .tab {
    margin: .53333333rem 0;
    text-align: center
}

.mb-enjoy .tab span {
    float: left;
    width: 22%;
    margin-right: 4%;
    line-height: .74666666rem;
    border: 1px solid #ccc;
    font-size: .24rem;
    color: #555
}

.mb-enjoy .tab span:nth-child(4n) {
    margin-right: 0
}

.mb-enjoy .tab span.active {
    border: 1px solid #0083c7;
    background: #0083c7;
    color: #fff
}

.mb-enjoy .js-tab-box .js-tab-con {
    height: 0;
    overflow: hidden
}

.mb-enjoy .js-tab-box .js-tab-con.active {
    height: auto
}

.mb-enjoy .box1 {
    border: 1px solid #eee;
    border-bottom: none
}

.mb-enjoy .box1 .text {
    text-align: right;
    padding: .46666666rem .4rem .46666666rem
}

.mb-enjoy .box1 .text .tit {
    padding-bottom: .26666666rem;
    position: relative
}

.mb-enjoy .box1 .text .tit:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    height: 2px;
    width: .8rem;
    background: #bd9976
}

.mb-enjoy .box1 .text .tit span {
    display: block;
    font-size: .37333333rem;
    line-height: .4rem;
    color: #333;
    letter-spacing: .08rem
}

.mb-enjoy .box1 .text .tit i {
    display: block;
    text-transform: uppercase;
    color: #aaa;
    letter-spacing: .05333333rem;
    font-size: .13333333rem;
    line-height: .4rem;
    font-style: normal
}

.mb-enjoy .box1 .text .tit p {
    margin-top: .13333333rem;
    font-size: .26666666rem;
    letter-spacing: .06666666rem;
    color: #333
}

.mb-enjoy .box1 .text .des {
    margin-top: .26666666rem;
    font-size: .21333333rem;
    line-height: .37333333rem
}

.mb-enjoy .box-text {
    background-image: url(../img/enjoy_bg.jpg);
    padding: .53333333rem .8rem
}

.mb-enjoy .box-text .tit {
    font-size: .29333333rem;
    color: #0083c7;
    font-weight: 700;
    letter-spacing: .06666666rem;
    position: relative;
    text-align: center
}

.mb-enjoy .box-text .tit span {
    display: inline-block;
    font-style: italic
}

.mb-enjoy .box-text .tit:before {
    content: " “ ";
    position: absolute;
    top: -.2rem;
    left: -.26666666rem;
    font-size: .69333333rem;
    color: #fff;
    opacity: .5;
    font-family: arial
}

.mb-enjoy .box-text .tit:after {
    content: " ” ";
    position: absolute;
    top: 0;
    right: -.26666666rem;
    font-size: .69333333rem;
    color: #fff;
    opacity: .5;
    font-family: arial
}

.mb-enjoy .box-text .des {
    margin-top: .13333333rem;
    font-size: .2rem;
    line-height: .29333333rem;
    text-transform: uppercase;
    color: #fff;
    opacity: .16;
    letter-spacing: .02666666rem
}

.mb-enjoy .box-text .name {
    margin-top: .1rem;
    text-align: right;
    font-style: italic;
    font-size: .24rem;
    letter-spacing: .04rem;
    color: #fff
}

.mb-enjoy .box-text .name span {
    position: relative
}

.mb-enjoy .box-text .name span:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -.8rem;
    width: .66666666rem;
    height: 1px;
    background: #fff
}

.mb-enjoy .box2 {
    background: #f5f5f5
}

.mb-enjoy .box2 .text {
    float: left;
    width: 50%;
    padding-top: .4rem;
    text-align: center
}

.mb-enjoy .box2 .text .tit {
    padding-bottom: .2rem;
    position: relative
}

.mb-enjoy .box2 .text .tit:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    height: 2px;
    margin-left: -.2rem;
    width: .4rem;
    background: #bd9976
}

.mb-enjoy .box2 .text .tit span {
    text-transform: uppercase;
    font-size: .24rem;
    color: #999;
    letter-spacing: .02666666rem
}

.mb-enjoy .box2 .text .tit p {
    font-size: .32rem;
    color: #333;
    letter-spacing: .07rem
}

.mb-enjoy .box2 .text .des {
    margin-top: .2rem;
    padding: 0 .4rem;
    font-size: .24rem;
    line-height: .4rem;
    letter-spacing: .04rem
}

.mb-enjoy .box2 .img {
    float: right;
    width: 50%
}

.mb-enjoy .box3 {
    position: relative
}

.mb-enjoy .box3 img {
    width: 100%
}

.mb-enjoy .box3 .text {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 60%;
    width: 50%;
    background: rgba(10, 36, 68, .8)
}

.mb-enjoy .box3 .text .tit span {
    color: #fff
}

.mb-enjoy .box3 .text .tit p {
    color: #fff
}

.mb-enjoy .box3 .text .des {
    color: #fff
}

.mb-enjoy .slick {
    margin-top: .66666666rem;
    padding: 0 .93333333rem
}

.mb-enjoy .slick-slide {
    padding: 0 .1rem;
    text-align: center
}

.mb-enjoy .slick-slide p {
    margin-top: .2rem;
    font-size: .26666666rem;
    color: #999
}

.mb-softlife-designer {
    padding: 1.13333333rem .4rem 0
}

.mb-softlife-designer .content {
    margin: .66666666rem 0 .53333333rem
}

.mb-softlife-designer .box1 .left {
    float: left;
    width: 3.17333333rem
}

.mb-softlife-designer .box1 .text {
    height: 2.66666666rem
}

.mb-softlife-designer .box1 .text span {
    padding-bottom: .26666666rem;
    display: block;
    position: relative;
    font-size: .32rem;
    font-weight: 700;
    line-height: .48rem;
    text-transform: uppercase;
    color: #bb9570
}

.mb-softlife-designer .box1 .text span:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: .26666666rem;
    height: 2px;
    background: #102543
}

.mb-softlife-designer .box1 .text p {
    margin-top: .13333333rem;
    font-size: .21333333rem;
    color: #aaa
}

.mb-softlife-designer .box1 .right {
    float: right;
    width: 5.86666666rem
}

.mb-softlife-designer .box2 {
    margin-top: .2rem
}

.mb-softlife-designer .box2 .img {
    float: left;
    width: 2.33333333rem;
    margin-right: .2rem
}

.mb-softlife-designer .box2 .con {
    float: right;
    width: 4rem;
    text-align: right
}

.mb-softlife-designer .box2 .con .text {
    font-size: .21333333rem;
    line-height: .4rem;
    color: #0083c7
}

.mb-softlife-designer .box2 .con .en {
    margin-top: .13333333rem;
    padding-bottom: .33333333rem;
    position: relative;
    font-size: .16rem;
    color: #aaa;
    text-transform: uppercase
}

.mb-softlife-designer .box2 .con .en:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: .4rem;
    height: 2px;
    background: #d2d2d2
}

.mb-softlife-style {
    padding: 1.26666666rem .4rem 1rem
}

.mb-softlife-style .slick {
    margin-top: .4rem
}

.mb-softlife-style .slick img {
    width: 100%
}

.mb-softlife-style .slick-next,
.mb-softlife-style .slick-prev {
    background-color: #fff;
    margin-top: -1.42rem
}

.mb-softlife-style .slick-prev {
    background-image: url(../img/slick_prev_black.png)
}

.mb-softlife-style .slick-next {
    background-image: url(../img/slick_next_black.png)
}

.mb-softlife-style .slick-slide {
    padding: 0 1px
}

.mb-softlife-style .text {
    padding: .46666666rem .53333333rem;
    border: 1px solid #eee;
    border-top: none
}

.mb-softlife-style .text .tit {
    position: relative;
    padding-right: 1.73333333rem
}

.mb-softlife-style .text .tit span {
    display: block;
    font-size: .34666666rem;
    color: #333
}

.mb-softlife-style .text .tit em {
    position: absolute;
    top: 0;
    right: 0;
    font-size: .24rem;
    color: #999
}

.mb-softlife-style .text .des {
    margin-top: .2rem;
    font-size: .24rem;
    color: #999;
    line-height: .45333333rem
}

.mb-softlife-style .text .des i {
    font-style: normal;
    color: #bb9570
}

.mb-soft {
    padding: .86666666rem .4rem 1.06666666rem;
    background-image: url(../img/mb_hotcase_bg.jpg)
}

.mb-soft .content {
    margin: .4rem 0 .13333333rem
}

.mb-soft .tit {
    margin-top: .6rem;
    color: #333;
    font-size: .32rem;
    text-align: center
}

.mb-soft li {
    margin-top: .33333333rem;
    float: left;
    width: 20%;
    text-align: center;
    position: relative
}

.mb-soft li span {
    font-size: .32rem;
    display: inline-block;
    width: .6rem;
    line-height: .6rem;
    height: .6rem;
    background-size: cover;
    background-image: url(../img/ico_liu.png)
}

.mb-soft li i {
    display: block;
    margin: .26666666rem auto 0;
    background: #001738;
    width: .8rem;
    border-radius: 100%;
    overflow: hidden
}

.mb-soft li p {
    margin-top: .13333333rem;
    font-size: .2rem;
    color: #333
}

.mb-soft li:before {
    content: "";
    position: absolute;
    top: 1.2rem;
    right: -10px;
    width: 0;
    height: 0;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #6d7d93;
    border-width: .09333333rem
}

.mb-soft li:last-child:before {
    display: none
}

.mb-soft .zx {
    margin: .4rem auto 0;
    display: block;
    width: 2rem;
    height: .66666666rem;
    line-height: .66666666rem;
    color: #fff;
    background: #0083c7;
    font-size: .32rem;
    text-align: center
}

.mb-craftsmanship {
    padding: 1.06666666rem .4rem 0
}

.mb-craftsmanship .ico-box {
    margin-top: .3rem;
    text-align: center
}

.mb-craftsmanship .ico-box span {
    display: inline-block;
    padding: 0 .5rem;
    border-right: 1px solid #e5e5e5
}

.mb-craftsmanship .ico-box span:last-child {
    border-right: none
}

.mb-craftsmanship .ico-box span p {
    margin-top: .13333333rem;
    font-size: .24rem;
    letter-spacing: .02666666rem;
    color: #664d02
}

.mb-craftsmanship .ico-box span img {
    width: .53333333rem
}

.mb-craftsmanship ul {
    margin: .46666666rem -.13333333rem 0
}

.mb-craftsmanship li {
    float: left;
    width: 50%;
    padding: 0rem .13333333rem;
    margin-bottom: 20px;
}

.mb-craftsmanship .item {
    display: block;
    color: #fff;
    text-align: center;
    padding: .8rem 0.5rem;
    /* height: 2.4rem */
}

.mb-craftsmanship .item span {
    font-size: .48rem
}

.mb-craftsmanship .item .des {
    margin-top: .13333333rem;
    font-size: .24rem;
    line-height: .54666666rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}

.mb-news {
    padding: .93333333rem .4rem .13333333rem
}

.mb-news .tab {
    text-align: center
}

.mb-news .tab span {
    margin: 0 .13333333rem;
    display: inline-block;
    font-size: .3rem;
    color: #0a2444;
    border: 2px solid #0a2444;
    padding: .15rem .4rem
}

.mb-news .tab span.active {
    background: #0a2444;
    color: #fff
}

.mb-news .js-tab-con {
    display: none
}

.mb-news .js-tab-con.active {
    display: block
}

.mb-news ul {
    margin-top: .26666666rem;
    border-top: 1px dashed #e9e9e9
}

.mb-news li {
    border-bottom: 1px dashed #e9e9e9
}

.mb-news li a {
    display: block;
    padding: .2rem 0
}

.mb-news li .date {
    float: left;
    width: 1.33333333rem;
    height: 1rem;
    border-right: 1px dashed #e9e9e9
}

.mb-news li .date span {
    display: block;
    font-size: .32rem;
    color: #252525
}

.mb-news li .date p {
    margin-top: .13333333rem;
    color: #787878;
    font-size: .2rem
}

.mb-news li .text {
    margin-left: 1.6rem
}

.mb-news li .text .tit {
    color: #252525;
    font-size: .32rem
}

.mb-news li .text .des {
    margin-top: .06666666rem;
    font-size: .16rem;
    line-height: .29333333rem;
    height: .58666666rem;
    overflow: hidden
}

.mb-news li .text .des i {
    color: #a97c4e
}

@media (max-width:767px) {

    .mb-banner img {
        height: 200px;
    }
}