.message-container{
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background: url(../image/wall_bg.jpg) no-repeat;
    background-size: cover;
    background-position: center top;

}
.bg-text-wrap{
    position: absolute;
    top: 80px;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.message-title-wrap{
    padding-top: var(--size-36);
    color: #fff;
}
.message-title-wrap .back-btn{
    display: block;
    width: 100%;
    color: #fff;
    text-align: right;
    opacity: .85;
    transition: all .3s;
}
.message-title-wrap .back-btn:hover{
    opacity: 1;
}
.message-title{
    margin-top: var(--size-80);
    text-align: center;
}

.lazhu-box{
    position: absolute;
    width: 100%;
    display: flex;
    /* justify-content: center; */
    align-items: flex-end;
    left: 0;
    bottom: 0;
}
.lazhu-img{
    position: relative;
    width: 11.354vw;
}
.lazhu-img img{
    width: 100%;
}
.lazhu-img .huo{
    position: absolute;
    width:100%;
    top: 0;
    left: 0;
   display: none;

}
.lazhu-img .huo img{
    width: 100%;
}
.lazhu-img.show .huo{
    display: block;
}
.message-bottom-wrap{
    position: absolute;
    bottom: 3vh;
    right: 0;
    z-index: 9;
    width: 100%;
}
.bottom-btn-wrap{
    
    width: 100%;
    justify-content: flex-end;
    display: flex;
    color: #fff;
    margin-bottom: var(--size-36);
}

.bottom-btn-wrap .item{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.bottom-btn-wrap .item + .item{
    margin-left: var(--size-20);
}
.bottom-btn-wrap .item .btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 11vw;
    height: 4vw;
    background: url(../image/btn_bg.png) no-repeat;
    background-size: 100% 100%;
    background-position: center;
    margin-bottom: var(--size-20);
    cursor: pointer;
}
.bottom-btn-wrap .item .btn i{
    margin-right: 6px;
}
@media screen and (max-width: 1200px) {
    .bottom-btn-wrap .item .btn{
        width: 140px;
        height: 52px;
    }
    .lazhu-img{
        width: 130px;
    }
}
@media screen and (max-width: 767px) {
    .lazhu-box{
        flex-direction: column-reverse;
        align-items: center;
    }
    .bottom-btn-wrap{
        position: relative;
        justify-content: center;

    }
    .message-bottom-wrap{
        position: static;
    }
    

    .bottom-btn-wrap .item .desc{
        position: absolute;
        width: 100%;
        top: 100%;
        left: 0;
        text-align: center;
    }
}
/* message-wrap */
.message-wrap{
    margin-top: 6.5vw;
}
.message-wrap .mulitline{
    display: flex;
    overflow-x: hidden;
    padding: 0;
    margin-bottom: var(--size-30);
    scrollbar-width: none;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.mulitline li {
    display: flex;
    margin-right: var(--size-24);
    color: #fff;
    white-space: nowrap;
    cursor: pointer;
}

.mulitline li .text{
    padding: var(--size-12) 0;
    padding-left: var(--size-36);
    padding-right: var(--size-12);
    border: 1px solid #393735;
    border-right: none;
    border-radius: 8px !important;
    transition: all .3s;
    background: rgba(0, 0, 0, .23);
}
.mulitline li .title{
    padding: var(--size-12) 0;
    padding-left: var(--size-24);
    padding-right: var(--size-36);
    background-color: rgba(0, 0, 0, .2);
    border-radius:0 var(--size-30) var(--size-30) 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .2);
}
.mulitline li:hover .text{
    background-color: #232323;
    /* color: var(--color-text-regular); */
}
@media screen and (max-width: 767px) {
    .message-wrap{
        margin-top: var(--size-40);
    }
}

/* message-wrap END */
/* form-tc */
.form-tc{
    background-color: unset;
    padding: 50px 0;
}
.form-tc .layui-layer-setwin .layui-layer-close2{
    background-color: unset;
    border: none;
    font-size: var(--size-40);
}
.form-tc .layui-input-block{
    margin-left: 0;
}
.layui-form-item{
    margin-bottom: 25px;
}
.form-tc .layui-input,
.form-tc .layui-select,
.form-tc .layui-textarea{
    background-color: unset;
    padding:0 ;
    color: #fff !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, .4) !important;
    font-size: 15px;
}
.form-tc .layui-input:hover, .form-tc .layui-select:hover, .form-tc .layui-textarea:hover, .form-tc .layui-input:focus, .form-tc .layui-select:focus, .form-tc .layui-textarea:focus{
    border-color:  rgba(255, 255, 255, .55) !important;
}
.form-tc .layui-input::placeholder,
.form-tc .layui-textarea::placeholder{
    color: rgba(255, 255, 255, .85) !important;
    font-size: 16px;
}
.form-tc .layui-input:-moz-placeholder,
.form-tc .layui-input::-moz-placeholder{
  color: rgba(255, 255, 255, .85);
  opacity: 1;
  font-size: 16px;
}
.form-tc .layui-textarea:-moz-placeholder,
.form-tc .layui-textarea::-moz-placeholder{
  color: rgba(255, 255, 255, .85);
  opacity: 1;
  font-size: 16px;
}

.form-tc .bottom-btn{
    text-align: center;
}
.form-tc .bottom-btn .layui-btn{
    margin: 0 auto;
    margin-top: 30px;
    background: #E4B388;
    font-size: 18px;
}
.code-form-item{
    position: relative;
}
.code-form-item .code-img{
    position: absolute;
    width: 90px;
    height: 100%;
    right: 0;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;

}
.code-form-item .code-img img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media screen and (max-width: 1439px) {
    .form-tc .bottom-btn .layui-btn {

      font-size: 16px;

    }
}
/* form-tc END */
.lzimg2 {
    width: 45vw;
    position: relative;
    left: 0;
    bottom: 0;
    
}
.lzimg2 img {
    width: 100%;
    object-fit: cover;
    object-position: right;
}