.header img{width:100%}
.index4{width:1200px;padding:160px 0 130px 0;margin:0 auto;position:relative}
.joins-form .pic{width:50%;height:294px;position:relative;overflow:hidden;float:left;background:url(../images/joins-form-pic1.jpg) no-repeat center;background-size:cover}
.joins-form .pic img{-webkit-transition:-webkit-transform 1s;-moz-transition:-moz-transform 1s;-o-transition:-o-transform 1s;transition:transform 1s;display:none}
.joins-form .pic .layer{width:100%;height:100px;position:absolute;bottom:0;left:0;right:0;padding:0 40px}
.joins-form .pic .layer h2{font-size:24px;color:#fff;line-height:1.833;position:relative;z-index:40}
.joins-form .pic .layer p{font-size:14px;color:#fff;line-height:1.929;position:relative;z-index:40}
.product-main .joins-form .pic .layer:before{width:100%;height:100%;position:absolute;top:0;left:0;-webkit-transition:all .3s ease;transition:all .3s ease;background-color:rgba(0,0,0,0);background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(#000));opacity:.4;content:" ";z-index:30}
.joins-form .pic .layer:hover:before{opacity:1}
.joins-form .form-box{width:50%;height:294px;border:1px solid #dedede;border-left:0;border-radius:0 2px 2px 0;float:right;box-sizing:border-box;padding:35px 0 0 66px}
.joins-form .form-box .row{margin-bottom:15px;max-width:440px}
.joins-form .form-box .text{width:428px;height:38px;border:1px solid #dedede;background:0 0;font-size:13px;color:#666;line-height:38px;padding-left:10px;margin-top:15px}
.joins-form .form-box .text::-webkit-input-placeholder{color:#666}
.joins-form .form-box .text:-moz-placeholder{color:#666}
.joins-form .form-box .text::-moz-placeholder{color:#666}
.joins-form .form-box .text:-ms-input-placeholder{color:#666}
.joins-form .form-box #joins{width:428px}
.joins-form .form-box #joins .text{width:205px}
.joins-form .form-box #joins .text:last-child{float:right}
.joins-form .form-box .type-row{width:428px}
.joins-form .form-box .type-row .layui-form-select .layui-input{color:#666;border-radius:0}
.joins-form .form-box .joins-btn{width:158px;height:40px;border-radius:20px;background:#c2a47d;border:1px solid #c2a47d;font-size:16px;letter-spacing:2px;color:#fff;margin-top:8px;cursor:pointer}
.joins-form .form-box .joins-btn:hover{background:0 0;color:#c2a47d}
.joins-form .form-box .base-row label{font-size:19px;color:#5f5f5f}
.joins-form .form-box .base-row .text{width:calc(100% - 86px)}
.city-picker-selector li.caller.active,.index4 .city-picker-selector li.caller.active:hover{background:#c2a47d;color:#fff}
.layui-form-select dl dd.layui-this{background-color:#c2a47d;color:#fff}
.city-title{float:left;line-height:38px;font-size:19px;color:#5f5f5f}
.bottom-text{display:block;font-size:13px;color:#5d5d5d;text-align:center;margin-top:18px}
.once_select{position:relative;z-index:10;width:179px;height:38px;background:#fff;float:left;margin-right:7px;border:1px solid #dedede}
.once_select p{padding:0 12px;font-size:14px;color:#666;line-height:38px;white-space:nowrap;background:url(../images/coating_arrow.png) no-repeat right 10px center;cursor:pointer}
.once_select ul{position:absolute;left:0;bottom:38px;background:#fff;z-index:20;display:none;width:100%;overflow-y:scroll;max-height:215px;white-space:nowrap;border:1px solid #dedede}
.once_select ul li{padding:0 12px;font-size:14px;color:#232323;line-height:38px;cursor:pointer}
.once_city{margin-right:0}
.box h1{font-size:35px;color:#232323;font-weight:400;text-align:center;position:relative;margin-bottom:58px}
.box h1::before{content:'';position:absolute;top:-30px;left:50%;transform:translateX(-50%);display:block;width:84px;height:2px;background-color:#c2a47d}
.box h1 em{color:#c2a47d}
.brand-adv{height:978px;background:url(../images/brand-adv_bg.jpg) no-repeat center;background-size:cover;text-align:center;overflow:hidden}
.brand-adv h1{margin-top:120px}
.floor{padding-top:144px}
.floor-swiper-item{padding-bottom:100px}
.floor-swiper-item .text{max-width:1426px;margin:0 auto;box-sizing:border-box;padding-left:194px}
.floor-swiper-item .text h2{font-size:25px;color:#222;position:relative}
.floor-swiper-item .text h2::before{content:'';display:block;position:absolute;top:12px;left:-68px;width:43px;height:7px;background-color:#c2a47d}
.floor-swiper-item .text h2 em{font-size:18px}
.floor-swiper-item span{display:block;font-size:19px;color:#222;line-height:25px;margin-top:14px}
.floor-swiper-item .floor-swiper-container{background:url(../images/floor-swiper1.jpg) no-repeat center;margin-top:27px}
.floor-swiper-item .f-swiper2{background:url(../images/floor-swiper2.jpg) no-repeat center}
.floor-swiper-item .f-swiper3{background:url(../images/floor-swiper3.jpg) no-repeat center}
.floor-swiper-item .f-swiper4{background:url(../images/floor-swiper4.jpg) no-repeat center}
.floor-swiper-item .floor-swiper-container .swiper-slide{text-align:center}
.floor-swiper-item .floor-swiper-container .swiper-pagination1{text-align:center;margin-top:18px}
.floor-swiper-item .floor-swiper-container .swiper-pagination-bullet-active{background:#c2a47d}
.floor-swiper-item .swiper-button-next,.swiper-button-prev{width:77px;height:77px}
.floor-swiper-item .floor-swiper-container .swiper-button-prev{background-image:url(../images/slide-prev_ico.png);background-size:contain;left:15%}
.floor-swiper-item .floor-swiper-container .swiper-button-disabled{opacity:1}
.floor-swiper-item .floor-swiper-container .swiper-button-next{background-image:url(../images/slide-next_ico.png);background-size:contain;right:15%}
.process{height:951px;background:url(../images/process_bg.jpg) no-repeat center;background-size:cover;overflow:hidden;box-sizing:border-box;padding-top:200px;text-align:center}
.process h1{color:#fff}
.process ul{width:1010px;margin:0 auto}
.process ul li{float:left;color:#fff;text-align:left;margin-right:48px}
.process ul li:last-child{margin-right:0}
.process ul li h2{font-size:25px;position:relative;margin-left:70px}
.process ul li h2::before{content:'';display:block;position:absolute;left:-70px;top:50%;transform:translateY(-50%);width:43px;height:8px;background-color:#c2a47d}
.process ul li span{display:block;min-height:50px;font-size:19px;margin-top:17px;margin-left:70px;margin-bottom:30px}
.process ul li .ico{height:94px;line-height:94px;text-align:center}
.process .floor-img{margin-top:50px}
.area{padding-top:140px;box-sizing:border-box;overflow:hidden;text-align:center}
.area h1{color:#303030;line-height:48px}
.area h2{font-size:19px;color:#46484a;text-align:center;position:relative}
.area h2 i{display:inline-block;width:44px;height:7px;margin-bottom:3px;margin-right:12px;background-color:#c2a47d}
.area h2 em{font-size:29px;color:#545454}
.area .map-img{margin-top:32px}
.area .promise-text{font-size:25px;line-height:35px;margin-top:50px;margin-bottom:40px}
.area .promise-text i{margin-bottom:5px}
.product{overflow:hidden;padding-top:190px;padding-bottom:140px}
.product ul{width:1200px;margin:0 auto;overflow:hidden}
.product ul li{float:left;position:relative;margin-right:8px}
.product ul li:last-child{margin-right:0}
.product ul li .cover{width:100%;height:100%;background:rgba(0,0,0,.55);position:absolute;left:0;top:0;color:#fff;font-size:21px;text-align:center}
.product ul li .cover .text{width:100%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.product ul li .cover span{display:block;margin-top:5px}
.product ul li .hover-box{display:none;width:83px;height:83px;background-color:#c2a47d;border-radius:50%;position:absolute;top:50%;left:50%;margin-top:-41px;margin-left:-41px;background-image:url(../images/product-hover_ico.png);background-repeat:no-repeat;background-position:center}
.product ul li:hover .cover{display:none}
.product ul li:hover .hover-box{display:block}
.nav{position:fixed;height:470px;width:140px;right:5%;top:15%;background:url(../images/nav-bg.png) no-repeat center;background-size:contain;z-index:10}
.nav a{display:block;color:#303030;font-size:19px;line-height:40px;text-align:center}
.nav a:first-child{margin-top:20px}
.nav a:nth-child(3){margin-top:4px}
.nav a:nth-child(5){margin-top:6px}
.nav .to-top{width:52px;height:41px;background:url(../images/go-top-ico.png) no-repeat center;margin:16px auto}
.nav .join-btn{background-color:#c2a47d;border-radius:20px;width:158px;height:39px;margin-left:-8px;color:#fff;text-align:center;font-size:19px;line-height:39px;cursor:pointer}
.mask-join-form{display:none;position:fixed;left:0;top:0;z-index:11;width:100%;height:100%;background:rgba(0,0,0,.5);text-align:center}
.mask-join-form h1{display:block;font-size:34px;color:#383838;margin-top:56px;margin-bottom:10px}
.mask-join-form h1 em{color:#b99668}
.mask-join-form .form-box{width:620px;height:398px;background:url(../images/join-form_bg.jpg) no-repeat center;background-size:cover;position:absolute;left:50%;top:50%;margin-left:-310px;margin-top:-192px;box-sizing:border-box;padding:0}
.mask-join-form .form-box .row{margin:0 auto}
.mask-join-form .form-box .city-row{margin-top:15px}
.mask-join-form .form-box .base-row .text{background:#fff}
.mask-join-form .city-title{margin-left:7px}
.mask-join-form .form-box .joins-btn{margin-top:24px}
.mask-join-form .form-box .once_select p{text-align:left}
.mask-join-form .form-box .sub-tip{position: absolute;bottom: -32px;left: 50%;transform: translateX(-50%);color: #fff;font-size: 15px;}
.mask-join-form .form-box .mask-close{width: 40px;height: 40px; background: url(../images/close.png) no-repeat center;background-size: contain;position: absolute;right: -60px;top: -20px;z-index: 15;cursor: pointer; }
.coating_bespoke{left:0;bottom:0;width:100%;height:94px;z-index:10;background:#c2a47d;position:fixed}
.coating_bespoke .coating-con{width:1140px;margin:0 auto}
.coating_bespoke .main{width:100%;padding-top:28px}
.coating_bespoke .layform{margin-left:40px}
.coating_bespoke .mspan{font-size:26px;color:#fff;display:block;float:left;margin-right:27px}
.coating_bespoke .main .name{font-size:16px;line-height:36px;margin-bottom:12px;color:#fff;display:none}
.coating_bespoke .main .con{position:relative;z-index:0}
.coating_bespoke .main .con .bespoke_text{display:block;float:left;width:190px;height:38px;background:#fff;border:none;margin-right:6px;padding:0 20px;font-size:14px;color:#232323;position:relative;z-index:10}
.coating_bespoke .main .con .bespoke_phone{width:190px}
.bespoke_select{position:relative;z-index:10;width:150px;height:38px;background:#fff;float:left;margin-right:6px}
.bespoke_select p{padding:0 12px;font-size:14px;color:#232323;line-height:38px;white-space:nowrap;background:url(../images/coating_arrow.png) no-repeat right 10px center;cursor:pointer}
.bespoke_select ul{position:absolute;left:0;bottom:38px;background:#fff;z-index:20;display:none;width:100%;overflow-y:scroll;max-height:215px;white-space:nowrap}
.bespoke_select ul li{padding:0 12px;font-size:14px;color:#232323;line-height:38px;cursor:pointer}
.coating_bespoke .main .con .bespoke_btn{width:140px;border-radius:40px;margin-left:32px;height:40px;background:#fff;font-size:20px;color:#c2a47d;border:none;transition:all .3s}
.coating_bespoke .main .con .bespoke_btn:hover{font-size:16px}
@media screen and (max-width:1440px){.nav{right:2%}
.brand-adv img{width:70%}
.floor-swiper-item .floor-swiper-container .swiper-button-prev{left:5%}
.floor-swiper-item .floor-swiper-container .swiper-button-next{right:5%}
.process .floor-img{width:100%}
}
@media screen and (max-width:1280px){.brand-adv{height:760px}
.index4{width:90%}
.product ul{width:90%}
.product ul li{width:16%;margin-right:.8%}
.product ul li img{width:100%}
} 
@media screen and (max-width:750px) {
.header{
    height: 260px;
    background: url('../images//hedaer_img.jpg') no-repeat center;
    background-size: cover;
}
.header img{
    display: none
}
.nav{display: none}
.coating_bespoke{display: none}
.once_select{width: 38%;}
.joins-form .pic{float: none;width: 100%;}
.joins-form .form-box{float: none;width: 100%;padding: 0;border-left: 1px solid #dedede;padding-left: 10px;height: 246px}
.joins-form .form-box .joins-btn{display: block;margin: 0 auto;}
.joins-form .form-box .base-row .text{width: calc(100% - 82px);}
.index4{padding: 80px 0;}
.brand-adv{height: 400px;}
.brand-adv img{width: 95%;}
.floor-swiper-item .text{padding-left: 58px;}
.brand-adv h1{margin-top: 70px;margin-bottom: 38px;}
.floor{padding-top: 85px;}
.floor-swiper-item .text h2{font-size: 18px}
.floor-swiper-item span{font-size: 16px;margin-top: 6px;}
.box h1{margin-bottom: 38px;}
.floor-swiper-item .text h2::before{left: -52px;}
.floor-swiper-item .floor-swiper-container{background: none}
.swiper-container .swiper-slide img{height: 260px;}
.floor-swiper-item .swiper-button-next, .swiper-button-prev{width: 26px;height: 26px;}
.process{height: auto;padding-top: 88px; padding-bottom: 50px;}
.process .floor-img{width: 90%;}
.process ul{width: 100%; display: flex;flex-direction: column;justify-content: flex-start;align-items: center}
.process ul li{margin-top: 20px;margin-right: 0;text-align: center}
.process ul li h2{margin-left: 0;}
.process ul li span{margin-left: 0;}
.process ul li h2::before{display: none}
.area{padding-top: 100px;}
.area h2 {padding: 0 10px}
.area h2 i{display: none;}
.area img{width: 95%;}
.product ul{display: flex;justify-content: flex-start;flex-wrap: wrap}
.product{padding-top: 100px;padding-bottom: 60px;}
.product ul li{width: 48%;margin-top: 10px;}
/* .coating_bespoke .coating-con{width: 100%;margin: 0;}
.coating_bespoke .main .con .bespoke_text{width: 30%;}
.bespoke_select{width: 38.2%;}
.coating_bespoke .main .con{display: flex;justify-content: flex-start;flex-wrap: wrap} */
}