*{box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; margin:0; padding:0; }
html{font-family: "Source Han Sans CN", "微软雅黑", "Arial","Helvetica Neue",Helvetica,STHeiTi,arial,sans-serif; -webkit-font-smoothing: antialiased; }
body{width: 100%; height: auto; min-width: 1200px; overflow: auto; background: #fff;}
ul,li{list-style:none;}
h1,h2,h3,h4,h5,h6{font-weight:400; color:#000;}
h1{font-size: 22px;}h2{font-size:20px}h3{font-size:18px}h4{font-size:16px}h5{font-size:14px}h6{font-size: 12px;}
a{text-decoration:none; color:#000;}
a img{ border: none; }
img{border:0; vertical-align:bottom; width: 100%; height: 100%;}
input{outline: none;}
i{display: inline-block; vertical-align: middle; font-style: normal;}
.container{width: 1200px; margin: 0 auto; position: relative; height: 100%;}
.x-center{display: flex; align-items: center; align-content: center;}
.y-center{display: flex; justify-content: center;}

/*loading icon*/
.loading,.loading>div{position:relative;}
.loading{font-size:0;color:#AD9055; margin-right: 10px;}
.loading>div{display:inline-block;float:none;background-color:#AD9055;border:0 solid #AD9055;}
.loading{width:20px;height:20px}
.loading>div{position:absolute;top:50%;left:50%;width:6px;height:6px;margin-top:-3px;margin-left:-3px;border-radius:50%;-webkit-animation:ball-spin 1s infinite ease-in-out;-moz-animation:ball-spin 1s infinite ease-in-out;-o-animation:ball-spin 1s infinite ease-in-out;animation:ball-spin 1s infinite ease-in-out}
.loading>div:nth-child(1){top:5%;left:50%;-webkit-animation-delay:-1.125s;-moz-animation-delay:-1.125s;-o-animation-delay:-1.125s;animation-delay:-1.125s}
.loading>div:nth-child(2){top:18.1801948466%;left:81.8198051534%;-webkit-animation-delay:-1.25s;-moz-animation-delay:-1.25s;-o-animation-delay:-1.25s;animation-delay:-1.25s}
.loading>div:nth-child(3){top:50%;left:95%;-webkit-animation-delay:-1.375s;-moz-animation-delay:-1.375s;-o-animation-delay:-1.375s;animation-delay:-1.375s}
.loading>div:nth-child(4){top:81.8198051534%;left:81.8198051534%;-webkit-animation-delay:-1.5s;-moz-animation-delay:-1.5s;-o-animation-delay:-1.5s;animation-delay:-1.5s}
.loading>div:nth-child(5){top:94.9999999966%;left:50.0000000005%;-webkit-animation-delay:-1.625s;-moz-animation-delay:-1.625s;-o-animation-delay:-1.625s;animation-delay:-1.625s}
.loading>div:nth-child(6){top:81.8198046966%;left:18.1801949248%;-webkit-animation-delay:-1.75s;-moz-animation-delay:-1.75s;-o-animation-delay:-1.75s;animation-delay:-1.75s}
.loading>div:nth-child(7){top:49.9999750815%;left:5.0000051215%;-webkit-animation-delay:-1.875s;-moz-animation-delay:-1.875s;-o-animation-delay:-1.875s;animation-delay:-1.875s}
.loading>div:nth-child(8){top:18.179464974%;left:18.1803700518%;-webkit-animation-delay:-2s;-moz-animation-delay:-2s;-o-animation-delay:-2s;animation-delay:-2s}
@-webkit-keyframes ball-spin{0%,100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}20%{opacity:1}80%{opacity:0;-webkit-transform:scale(0);transform:scale(0)}}
@-moz-keyframes ball-spin{0%,100%{opacity:1;-moz-transform:scale(1);transform:scale(1)}20%{opacity:1}80%{opacity:0;-moz-transform:scale(0);transform:scale(0)}}
@-o-keyframes ball-spin{0%,100%{opacity:1;-o-transform:scale(1);transform:scale(1)}20%{opacity:1}80%{opacity:0;-o-transform:scale(0);transform:scale(0)}}
@keyframes ball-spin{0%,100%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}20%{opacity:1}80%{opacity:0;-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}

/*header*/
header{width: 100%; background-color: #ffffff;}
header .swfarbe-proxy{width: 100%; background-color: #333333; height: 80px; overflow: hidden; transition: all .2s; transition-timing-function: ease; display: none;}
header .swfarbe-proxy.active{height: 0; opacity: 0;}
header .swfarbe-proxy span{color: #ffffff; font-size: 22px; font-weight: 500; line-height: 80px;}
header .swfarbe-proxy .btn{font-size: 14px; color: #ffffff; cursor: pointer; text-decoration: underline; opacity: .6; position: absolute; right: 0;}
header .logo-wrap{}
header .logo-wrap .logo{width: 203px; height: 126px;}
header .logo-wrap .info{position: absolute; right: 0; top: 0; display: flex; align-content: center; align-items: center; height: 132px; width: 190px; flex-wrap: wrap;}
header .logo-wrap .info .item{display: flex; align-items: center; align-content: center; margin: 4px 0;}
header .logo-wrap .info .item .icon{width: 32px; height: 32px;}
header .logo-wrap .info .item .tel{color: #333333; font-size: 22px; margin-left: 8px; font-weight: 500;}
header .logo-wrap .info .item .shop-group{display: flex; align-content: center; align-items: center;}
header .logo-wrap .info .item .shop-group a{display: block; width: 28px; height: 28px; margin-left: 8px; border-radius: 8px;}
header .column{width: 100%; height: 84px; border-bottom: 1px solid #E5E5E5; justify-content: space-between; position: relative;}
header .column .item{width: 150px; height: 100%; align-content: center; align-items: center; flex-wrap: wrap; cursor: pointer; position: relative;}
header .column .item .title{font-size: 20px; color: #333333; font-weight: 500; margin: 8px 0; width: 100%; text-align: center; transition: all .2s;}
header .column .item .titleEN{font-size: 12px; color: #B4B4B4; font-weight: 500; width: 100%; text-align: center; transition: all .2s;}
header .column .item.active .title,header .column .item.active .titleEN{color: #AD9055;}
header .column .item:hover .title,header .column .item:hover .titleEN{color: #AD9055;}
header .column .item .line{position: absolute; left: 0; bottom: -1px; width: 150px; height: 4px; background-color: #AD9055; transition: left .2s; display: none;}
header .column .item .line.active{display: block;}

footer{}
footer .form-container{height: 610px;}
footer .form-wrap{position: absolute; top: 181px; width: 100%; z-index: 2;}
footer .form-wrap .form-header{width: 100%; height: 164px; background-color: #ECECEC; display: flex; align-content: center; align-items: center; padding: 0 50px;}
footer .form-wrap .form-header .icon{width: 68px; height: 68px; border-radius: 8px; background-color: #AD9055; display: flex; justify-content: center; align-content: center; align-items: center;}
footer .form-wrap .form-header .icon img{width: 40px; height: 37px;}
footer .form-wrap .form-header .text{margin-left: 24px; height: 72px; display: flex; align-content: space-between; flex-wrap: wrap;}
footer .form-wrap .form-header .text div{width: 100%;}
footer .form-wrap .form-header .text .title{color: #AD9055; font-size: 26px;}
footer .form-wrap .form-header .text .remark{color: #666666; font-size: 20px;}
footer .form-wrap .form-content{width: 100%; height: 433px; background-color: #AD9055; padding: 60px; display: flex; flex-wrap: wrap; justify-content: space-between; align-content: space-between;}
footer .form-wrap .form-content .input-wrap{width: 500px; height: 77px; display: flex; justify-content: space-between; margin-bottom: 30px;}
footer .form-wrap .form-content .input-wrap input{width: 100%; height: 77px; font-size: 20px; color: #333333; outline: none; padding: 0 20px; border: none;}
footer .form-wrap .form-content .input-wrap select{width: 230px;}
footer .form-wrap .form-content .btn{width: 182px; height: 67px; background-color: #4A4A4A; color: #ffffff; font-size: 22px; text-align: center; line-height: 67px; cursor: pointer;}
footer .form-wrap .form-content .btn:active{opacity: .6;}
footer .footer-container{background-color: #212121; height: 550px;}
footer .footer-container .container{display: flex; justify-content: space-between; padding-top: 233px; flex-wrap: wrap; height: 250px;}
footer .footer-container .company-info{width: 385px;}
footer .footer-container .company-info .footer-logo{width: 105px; height: 66px; margin-bottom: 20px;}
footer .footer-container .company-info .text{color: #ffffff; font-size: 14px; margin-top: 10px;}
footer .footer-container .company-info .tel{font-size: 24px; margin-top: 0;}
footer .footer-container .company-info .shop-group{display: flex; align-content: center; align-items: center; margin-top: 14px;}
footer .footer-container .company-info .shop-group a{display: block; width: 24px; height: 24px; margin-left: 14px; border-radius: 8px;}
footer .footer-container .company-info .shop-group a:first-child{margin-left: 0;}
footer .footer-container .line{width: 2px; height: 171px; background-color: #707070; margin-right: 103px;}
footer .footer-container .nav{width: 710px; display: flex; justify-content: space-between; }
footer .footer-container .nav .item{width: 110px;}
footer .footer-container .nav .item a:first-child{color: #ffffff; font-size: 18px; margin-bottom: 26px;}
footer .footer-container .nav .item a{color: #B3B3B3; font-size: 14px; margin-bottom: 16px; display: block;}
footer .footer-container .nav .item a:hover{color: #ffffff; text-decoration: underline;}
footer .beian{width: 1200px; height: 80px; margin-top: 24px; border-top: 1px solid rgba(255, 255, 255, .4); display: flex; justify-content: center; align-items: center; align-content: center;}
footer .beian *{color: #ffffff; font-size: 14px;}
footer .beian a{margin-left: 6px;}

.crumbs{display: flex; align-content: center; align-items: center; padding: 20px 0;}
.crumbs a{font-size: 16px; color: #999999; text-decoration: none;}
.crumbs a.active{color: #AD9055;}
.crumbs a:hover{text-decoration: underline;}
.crumbs .icon{width: 10px; height: 10px; margin: 0 10px; background-size: cover; background-image: url("data:image/png;base64,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");}

/*index-banner*/
.index-banner{width: 100%; height: 720px; overflow: hidden; position: relative;}
.index-banner .swiper-container{width: 100%; height: 720px;}
.index-banner .swiper-slide{background-size: auto 100%; background-position: center center; background-repeat: no-repeat; height: 675px}
.index-banner .swiper-slide a{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.index-banner-pagination .swiper-pagination-bullet{width: 30px; height: 6px; background: #E1E1E1; margin: 0 7px !important; opacity: 1; border-radius: 4px; transition: background .5s;}
.index-banner-pagination .swiper-pagination-bullet-active{background: #AD9055;}

.index-center-wrap{background-size: cover; background-position: center; margin-top: 160px; }
.index-center-wrap .item{height: 540px; width: 100%; position: relative;}
.index-center-wrap .info .subtitle{color: #AD9055; font-size: 20px; font-weight: 400; margin-bottom: 20px;}
.index-center-wrap .info .title{color: #333333; font-size: 48px; font-weight: 400; margin-bottom: 30px;}
.index-center-wrap .info-1{height: 100%; width: 600px; flex-wrap: wrap;}
.index-center-wrap .info *{ display: block; width: 100%; text-align: center;}
.index-center-wrap .info-2{width: 100%; flex-wrap: wrap; padding-top: 74px;}
.index-center-wrap .info-3{height: 100%; width: 600px; flex-wrap: wrap; position: absolute; right: 0;}
.index-center-wrap .info-4{width: 100%; flex-wrap: wrap; }
.index-center-wrap .info .intro{padding: 0 220px; margin-bottom: 60px; height: auto; font-size: 20px; color: #666666; line-height: 36px;}
.index-center-wrap .info-5{width: 700px; height: 100%; flex-wrap: wrap; position: absolute; right: 0;}

.index-btn{border: 2px solid #AD9055; overflow: hidden; cursor: pointer; position: relative; width: 224px !important; height: 62px;}
.index-btn .text{width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; transition: color .5s; display: flex; align-items: center; align-content: center; justify-content: center; font-size: 18px; color: #333333;}
.index-btn .circle{border-radius: 50%; opacity: 0; background: #AD9055; top: -119px; left: -38px; position: absolute; width: 300px; height: 300px; transform: scale(0); transition: all .3s;}
.index-btn.active .circle{opacity: 1; transform: scale(1);}
.index-btn.active .text{color: #ffffff !important;}

.scroll-container{width: 100%; min-width: 1200px;}
.scroll-container .swiper-container{height: 700px;}
.scroll-container .swiper-slide{width: 406px; height: 588px; box-shadow: 0px 8px 24px rgba(127, 127, 127, 0.16);}
.scroll-container .swiper-slide .image-container{width: 100%; height: 540px; background-position: center; background-size: cover;}
.scroll-container .swiper-slide .name{height: 48px; line-height: 48px; padding: 0 16px; font-size: 20px; color: #333333;}
.scroll-container-pagination .swiper-pagination-bullet{width: 22px; height: 22px; margin: 0 10px !important; background: #FFFFFF; border: 2px solid #AD9055; border-radius: 50%; opacity: 1; transition: background .5s;}
.scroll-container-pagination .swiper-pagination-bullet-active{background: #AD9055;}

.index-nav-title{text-align: center; font-size: 34px; color: #333333; margin-top: 160px;}

.index-between-wrap{ margin-top: 60px; justify-content: space-between; flex-wrap: wrap; display: flex;}
.index-between-wrap .item{height: 760px; width: 585px; position: relative; background-size: cover; background-position: center;}
.index-between-wrap .info{flex-wrap: wrap; padding-top: 87px;}
.index-between-wrap .info .subtitle{color: #666666; font-size: 22px; font-weight: 400; margin-bottom: 20px; width: 100%; text-align: center;}
.index-between-wrap .info .title{color: #666666; font-size: 40px; font-weight: 400; margin-bottom: 30px; width: 100%; text-align: center;}
.index-between-wrap .info-1 .subtitle,.index-between-wrap .info-1 .title,.index-between-wrap .info-1 .index-btn .text{color: #ffffff;}
.index-between-wrap .info-1 .index-btn{border-color: #ffffff; }
.index-between-wrap .info-1 .index-btn .text{color: #ffffff;}
.index-between-wrap .info-1 .index-btn .circle{background: #ffffff;}
.index-between-wrap .info-1 .index-btn.active .text{color: #666666 !important;}

.index-color-bg-wrap{background-color: #F7F7F7; padding-bottom: 200px;}

.inspiration-image-wrap{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60px;}
.inspiration-image-wrap .item{overflow: hidden; margin-bottom: 32px;}
.inspiration-image-wrap .item:nth-child(1),.inspiration-image-wrap .item:nth-child(4){width: 772px; height: 462px;}
.inspiration-image-wrap .item:nth-child(2),.inspiration-image-wrap .item:nth-child(3){width: 396px; height: 396px;}
.inspiration-image-wrap .item .image-wrap{background-size: cover; background-position: center; width: 100%; height: 100%; transition: all .5s;}
.inspiration-image-wrap .item .image-wrap:hover{transform: scale(1.1);}

.product-header{display: flex; justify-content: space-between; width: 100%;}
.product-header .product-image{width: 435px; height: 435px; background-size: cover; background-position: center;}
.product-header .product-info{display: flex; align-items: center; align-content: center; width: 640px; height: 435px; flex-wrap: wrap;}
.product-header .product-info .title{width: 100%; position: relative; padding-top: 50px; padding-left: 38px;}
.product-header .product-info .title .bg{font-size: 80px; color: rgba(23, 33, 75, 0.06); position: absolute; top: 0; left: 0; font-weight: 800; z-index: -1;}
.product-header .product-info .title .label{margin-bottom: 11px; display: flex; align-items: end;}
.product-header .product-info .title .label .en{font-size: 18px; font-weight: 500; color: #17214B;}
.product-header .product-info .title .label .desc{font-size: 16px; color: #17214B; margin-left: 10px;}
.product-header .product-info .title .name{display: inline-block; font-weight: 500; height: 67px; padding: 0 50px; font-size: 36px; color: #ffffff; line-height: 67px; box-shadow: 8px 8px 8px rgba(23, 33, 75, 0.51); background: #17214B;}
.product-header .product-info .intro{width: 100%; margin-top: 50px; }
.product-header .product-info .intro .item{width: 100%; display: flex; margin-bottom: 10px;}
.product-header .product-info .intro .item .icon{width: 16px; height: 16px; background-size: cover; margin-top: 5px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAl5JREFUWEftlj9oFEEUxr83pxgV4UByGzGYmRMFEWIKwU5SWITbICpEW4VALCJEsNaApWAKr5BgEVsFhXAbBZtgKyKKIOhld7XQ3aSwEP9hnCcLOTTL/mHn7gyCW86+N9/vffP2zRI2+KEN1se/DWDtsat6c0msLM03TZ00dqBX1oYE0bNIWAgc/rDkPDWBMAawqvYMGFNrorOh50z8NYA+OSKZSlH15ZaoqQtGDlRk7QoRTccqNnKhMEBZnihvoR9R9TJuuYkLhQEsaU+BMJNy3oVdKA6g7Kj6obSGK+pCKsAuVRtgFgrQCkQKIMnQhwAazOn2TwAeguCyhksCLlbhhu8cNylvHYClauPMdJ6IJMA7TT6rjJyPzHAF0VzgNeqtuPUA0n4JwsEOC8e3ex96zu5EgD5ljzFwp5sABJwOPOduIkC02E2IuHikl9iE3YBIEk8F6LQTaeKZAJ2CyBLPBYgCrGrtIpiumzQmMyaWfWc2Kzd3Elb2jp4kzfdMAAh8JvAWMr+qfABlXyLgmhkArgaec7ktB6yqfRMMo58NMO6HvnOqPQBlPwJwzMQBAG9Cz9nfLkB0iaiUTRbX1ofTRHaUdE+z+eB72vucHpgWlnryM57MwGMB1FsjNRpcGpgk4Gg8Nu96zgTorY7uE8yvf2/KLwBxI/Qat5IqstToOKAv/Hlla8bZFd+5beRARY0MEkrPAbxloL6NP9d9f/Fb1plKOdzzhbZHbkwCGCDmc4G/MGcE0N8/tnV109cjmsSrZW8+LNKIFXXcEqwPBH6j1SeJ6blzoIioSex/gF92jNMhwcuxdwAAAABJRU5ErkJggg==");}
.product-header .product-info .intro .item p{margin-left: 8px; font-size: 18px; color: #17214B; display: block; width: calc(100% - 24px);}
.product-attr{width: 100%; margin-top: 30px;}
.product-attr .th,.product-attr .td{width: 100%; display: flex; height: 60px; background: #17214B;}
.product-attr .td{background: #F5F5F5;}
.product-attr .th .item,.product-attr .td .item{width: 200px; text-align: center; line-height: 60px; color: #ffffff; font-size: 20px;}
.product-attr .td .item{color: #17214B;}

.product-performance{width: 100%; height: 355px; background-size: auto 100%; background-position: center; background-repeat: no-repeat; margin-top: 80px;}
.product-performance .title,.product-certification .title{width: 100%; padding-top: 92px; position: relative; }
.product-performance .title .label,.product-certification .title .label{width: 100%; text-align: center; font-size: 50px; font-weight: 800; color: rgba(23, 33, 75, 0.06); z-index: -1; position: absolute; top: 50px; left: 0;}
.product-performance .title .icon,.product-certification .title .icon{width: 33px; height: 30px; position: absolute; top: 85px; left: 468px;}
.product-performance .name,.product-certification .title .name{}
.product-performance .title .name .zn,.product-certification .title .name .zn{font-size: 34px; font-weight: bold; color: #333333; text-align: center;}
.product-performance .title .name .en,.product-certification .title .name .en{font-size: 12px; color: #AD9055; text-align: center; }
.product-performance .list{display: flex; justify-content: space-around; width: 100%; margin-top: 66px;}
.product-performance .list .item{width: 230px; height: 75px; display: flex; align-items: center; align-content: center;}
.product-performance .list .item .icon{width: 75px; height: 75px;}
.product-performance .list .item .info{width: calc(100% - 105px); height: 100%; margin-left: 30px; display: flex; align-content: center; align-items: center; flex-wrap: wrap;}
.product-performance .list .item .info .name{font-size: 20px; font-weight: 400; color: #AD9055;}
.product-performance .list .item .info .desc{font-size: 26px; font-weight: 500; color: #333333; margin-top: 4px;}
.product-performance .list .item .info .contrast{display: flex; margin-top: 14px;}
.product-performance .list .item .info .contrast div{width: 10px; height: 26px; margin-right: 6px; background: #B2B2B2;}
.product-performance .list .item .info .contrast div.active{background: #333333;}

.product-use{display: flex; justify-content: space-around; margin-top: 120px;}
.product-use .item{width: 500px;}
.product-use .item .title{width: 100%; position: relative; margin-bottom: 40px;}
.product-use .item .title .en{font-size: 90px; color: rgba(173, 144, 85, 0.16); font-weight: 800; z-index: -1; text-align: center; width: 100%;}
.product-use .item .title .zn{font-size: 30px; color: #333333; font-weight: bold; text-align: center; width: 100%; position: absolute; top: 45px; left: 0; z-index: 2;}
.product-use .item .content{width: 100%; }
.product-use .item .content .item{margin-bottom: 14px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.product-use .item .content .icon{width: 12px; height: 12px; margin-top: 9px; background-size: cover; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAsVJREFUSEu9Vl1uElEUPmemsTGalCYKjw4r6AALKH2zYCJdQWEF6goKK9AdlK5ASLT65nQB0GEFnWc0ERKNKXHm+p2ZuTCM/Iyxel+4zD33/Hzn57tMG1bOemrtkvGciBuKVI6ZbRFXSrlMPMGud0tBf+J99Nap4VUHovgeGWdQ2NzkgD6Dwe6Mgs4qQ78ZyFvHDSLjnJlysbd9/LoBGc5P+ubKtx16aBsUVLG14QQilKgIEQWtsfehl3RqycBjq9Y0mM/jCyPA0vzsXYZK1y3csQFXFw4diEygVAt3ulp+bmBZueqMvct2Fni0TN6qtRHNWeRccKIjCQ1EmJvXAgvw/GPl2kjBqr0h5hcC14z8kuQkNJC36hLiKQ5GY+99WCnJVS6Xm/AO5yo8w15g6w4Gg4u0LHS5Ahd0XUBXk8NSZPMmxq+UxNy27Zxpmm9xVl0Dl+P7/onrukhwtCQnyOO17G+VX+SCVX9JTK/hXR+4o4IWC5478PZwjXL92UEkR0kZ5KMXVpeiVzBQcxDzYRr7GJaworYt3G0Nh8OulpsnXKkrLhRrHlB94is++uK9c7RQRu9DcRi4goE5jI+sZ1WT1aew4wvFuorw+r4/8Zw5lpVKRfZ727yPDUxgYF/L5qxqbpcffJX/d2IAeqbIQ9j5slIG/iVENPoPSf7LMk0nWCBaKtNtjWYYhtT0yl4Q5UEQNDY2WmRRjwrlotlK6cqRnsA3GRdzwsH/brL2Fz2QGhVR1jHs2BCW2ruTYUdqOlOBPR92URTHDWZD5o40ThuRdLL0gJbRkzS6nxrXWijFCS46UMgjA+EQGDCCby3hLDAEZTIYCnDF0QgFgjIVKPPHSL7t0P0Dg7iKrVBmOCDBflO43txImdpITEBgKDrNApPMfhBMOxPpJxVGzxYTHio8WxjPloh3hZiYFGYV49ni9zY9W34BViW4YizwoG4AAAAASUVORK5CYII=");}
.product-use .item .content .p{width: calc(100% - 24px); margin-left: 12px; font-size: 16px; font-weight: 500; color: #333333; line-height: 30px; }
.product-use .item .content .p span{padding-bottom: 4px; border-bottom: 1px solid #17214B;}

.product-certification{margin-top: 120px;}
.product-certification .list{width: 100%; display: flex; justify-content: space-around; flex-wrap: wrap; margin-top: 72px;}
.product-certification .list .item{width: 200px; height: 200px; margin: 20px 50px;}
.product-certification .list .item .image{width: 200px; height: 160px; display: flex; align-content: center; align-items: center; justify-content: center;}
.product-certification .list .item .image img{width: auto; height: auto; max-width: 160px; max-height: 160px;}
.product-certification .list .item .name{margin-top: 14px; color: #333333; font-size: 18px; text-align: center; width: 100%;}

.color-story-menu{display: flex; justify-content: center; margin: 80px 0;}
.color-story-menu .item{width: 104px; margin: 0 51px; cursor: pointer; display: block;}
.color-story-menu .item .icon{width: 104px; height: 104px; background-size: cover; background-position: center; }
.color-story-menu .item .icon-1{background-image: url("/static/swfarbe2022/images/cs-i-11.png");}
.color-story-menu .item .icon-2{background-image: url("/static/swfarbe2022/images/cs-i-21.png");}
.color-story-menu .item .icon-3{background-image: url("/static/swfarbe2022/images/cs-i-31.png");}
.color-story-menu .item .title{font-size: 20px; color: #666666; margin-top: 12px; text-align: center;}
.color-story-menu .item.active .title{color: #AD9055;}
.color-story-menu .item.active .icon-1{background-image: url("/static/swfarbe2022/images/cs-i-1.png");}
.color-story-menu .item.active .icon-2{background-image: url("/static/swfarbe2022/images/cs-i-2.png");}
.color-story-menu .item.active .icon-3{background-image: url("/static/swfarbe2022/images/cs-i-3.png");}

.color-story-list{display: flex; justify-content: space-between; flex-wrap: wrap;}
.color-story-list .item{width: 584px; transition: all .3s; margin-bottom: 50px; display: block;}
.color-story-list .item:hover{box-shadow: 0px 8px 24px rgba(127, 127, 127, 0.16);}
.color-story-list .item .cover{width: 584px; height: 352px; background-size: cover; background-position: center;}
.color-story-list .item .info{width: 100%; padding: 20px;}
.color-story-list .item .info .type{font-size: 20px; color: #AD9055; font-weight: bold; margin-bottom: 20px;}
.color-story-list .item .info .title{font-size: 26px; color: #333333; font-weight: 400; margin-bottom: 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.color-story-list .item .info .desc{font-size: 20px; color: #666666; margin-bottom: 30px; line-height: 30px; word-break: break-all; text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.color-story-list .item .info .date{font-size: 16px; color: #666666;}
.color-story-banner{height: 352px; margin-bottom: 100px; background-size: cover; background-position: center; display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: center;}
.color-story-banner div{color: #ffffff; width: 100%; text-align: center;}
.color-story-banner .text-1{font-size: 20px;}
.color-story-banner .text-2{font-size: 36px;}

.color-story-detail-container{margin-top: 124px;}
.color-story-detail-container .title{text-align: center; font-size: 44px; color: #333333; font-weight: 500;}
.color-story-detail-container .desc{text-align: center; font-size: 24px; color: #666666; font-weight: 400; padding: 0 147px; margin: 80px 0 50px;}
.color-story-detail-container .date{font-size: 18px; color: #666666; margin-bottom: 80px; text-align: center;}

.product-list{width: 100%; height: 754px; overflow: hidden; position: relative; min-width: 1620px;}
.product-list .swiper-container{width: 100%; height: 754px;}
.product-list .swiper-slide{position: relative; background-size: auto 100%; background-position: center center; background-repeat: no-repeat; height: 754px;}
.product-list .content{ width: 1620px; height: 100%; position: relative; margin: 0 auto;}
.product-list .content .label{position: absolute; top: 220px; left: 218px; width: 550px;}
.product-list .content .label .title{font-size: 44px; color: #ffffff; font-weight: bold; text-shadow: 0px 1px 7px rgba(35, 54, 75, 0.8);}
.product-list .content .label .intro{font-size: 20px; font-weight: 400; color: #ffffff; margin-top: 24px; line-height: 34px; text-shadow: 0px 1px 7px rgba(35, 54, 75, 0.8);}
.product-list .content .info{position: absolute; top: 80px; left: 1160px;}
.product-list .content .info .title{position: relative; height: 90px;}
.product-list .content .info .title .en{font-size: 60px; color: rgba(255, 255, 255, 0.3); font-weight: bold; position: absolute; top: 0; left: 0;}
.product-list .content .info .title .zn{font-size: 30px; color: #ffffff; font-weight: bold; position: absolute; bottom: 0; left: 0;}
.product-list .content .info .flag{font-size: 22px; color: #ffffff; font-weight: 500; margin: 20px 0 25px;}
.product-list .content .info .desc{font-size: 18px; color: #ffffff; font-weight: 400; line-height: 30px; margin-bottom: 40px;}
.product-list .content .info .list{width: 395px; display: flex; justify-content: center; margin-top: 20px;}
.product-list .content .info .list .item{width: 120px; height: 110px; margin: 0 15px; position: relative;}
.product-list .content .info .list .item .wrap{width: 100px; height: 90px; margin: 0 10px; padding: 5px; background: #ffffff;}
.product-list .content .info .list .item .wrap .image{width: 90px; height: 80px; background-position: center; background-size: cover; padding: 5px; border: 1px solid #AD9055;}
.product-list .content .info .list .item .name{width: 100%; height: 24px; color: #ffffff; background: #AD9055; font-size: 14px; text-align: center; line-height: 24px;
    position: absolute; bottom: 5px; left: 0; border-radius: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.product-list .content .info .list-1{width: 348px;}
.product-list .content .info .list-1 .item{width: 160px;}
.product-list .content .info .list-1 .item .wrap{width: 140px;}
.product-list .content .info .list-1 .item .wrap .image{width: 130px;}
.product-list .menu-container{width: 100%; position: absolute; bottom: 80px; left: 0; z-index: 19930203;}
.product-list .menu-container .menu-content{width: 1620px; margin: 0 auto; position: relative;}
.product-list .menu-container .menu-content .menu{position: absolute; left: 1000px; top: 0; z-index: 19930203; display: flex; align-content: center; align-items: center;}
.product-list .menu-container .menu-content .menu .item{font-size: 18px; cursor: pointer; color: #ffffff; font-weight: 400; transition: font-size .3s;}
.product-list .menu-container .menu-content .menu .item.active{font-size: 22px; font-weight: bold; padding: 2px 0; border-bottom: 2px solid #ffffff;}
.product-list .menu-container .menu-content .menu .dot{width: 6px; height: 6px; background: #ffffff; margin: 0 20px; border-radius: 50%; }

.trendfarben{padding-top: 100px;}
.trendfarben .years-color{width: 100%; }
.trendfarben .years-color .title{text-align: center; font-size: 30px; font-weight: 500; color: #333333;}
.trendfarben .years-color .info{display: flex; justify-content: space-between; margin-top: 80px;}
.trendfarben .years-color .info .effect-wrap{width: calc(274px + 543px); display: flex;}
.trendfarben .years-color .info .effect-wrap .cover{width: 274px; height: 360px; background-size: cover; background-position: center; }
.trendfarben .years-color .info .effect-wrap .effect{width: 543px; height: 360px; background-size: cover; background-position: center; }
.trendfarben .years-color .info .intro{margin-left: 45px; font-size: 26px; color: #333333; line-height: 44px; width: 338px; height: 360px; display: flex; justify-content: center; align-items: center; align-content: center; background-size: 133px 203px; background-position: top right; background-repeat: no-repeat; background-image: url("data:image/png;base64,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")}
.trendfarben .color-24{margin-top: 110px;}
.trendfarben .color-24 .title{}
.trendfarben .color-24 .title{width: 100%; padding-top: 92px; position: relative; }
.trendfarben .color-24 .title .icon{width: 33px; height: 30px; position: absolute; top: 90px; left: 385px; background-size: cover; background-image: url("data:image/png;base64,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");}
.trendfarben .color-24 .title .name{}
.trendfarben .color-24 .title .name .first{font-size: 34px; font-weight: bold; color: #333333; display: flex; align-content: center; align-items: center; justify-content: center;}
.trendfarben .color-24 .title .name .first span{font-size: 60px; margin-top: -8px; font-weight: 600; color: #AD9055; margin-right: 16px;}
.trendfarben .color-24 .title .name .second{font-size: 22px; color: #666666; text-align: center; }
.trendfarben .color-24 .color-list{width: 1170px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap;}
.trendfarben .color-24 .color-list .item{width: 180px; cursor: pointer;}
.trendfarben .color-24 .color-list .item{margin-top: 30px; transition: all .3s;}
.trendfarben .color-24 .color-list .item:hover{box-shadow: 0px 8px 24px rgba(127, 127, 127, 0.3);}
.trendfarben .color-24 .color-list .item .cover{width: 180px; height: 252px; background-size: cover; background-position: center;}
.trendfarben .color-24 .color-list .item .name{width: 180px; height: 36px; text-align: center; line-height: 36px; background: #F9F6F0; font-size: 16px; color: #333333;}
.trendfarben .color-24 .color-list .item-effect{width: 100%; height: 0; overflow: hidden; position: relative; cursor: auto; transition: height .5s;}
.trendfarben .color-24 .color-list .item-effect.active{height: 700px; margin-top: 30px;}
.trendfarben .color-24 .color-list .item-effect .close{width: 85px; height: 32px; position: absolute; top: 24px; right: 13px; font-size: 14px; color: #ffffff; background: #333333; opacity: .8; text-align: center; line-height: 32px; z-index: 19930203; border-radius: 16px; cursor: pointer;}

.designfarben-container{padding-top: 80px;}
.designfarben-container .remark{font-size: 30px; color: #333333; text-align: center; width: 482px;}
.designfarben-container .list{width: 100%; display: flex; justify-content: space-between;}
.designfarben-container .list .series{width: 482px; height: 515px;}
.designfarben-container .list .series .item{width: 100%; height: 100%; position: relative; margin-top: 42px; margin-bottom: 50px;}
.designfarben-container .list .series .item .cover{width: 482px; height: 482px; border-radius: 50%; background-position: center; background-size: cover;}
.designfarben-container .list .series .item .color-list{width: 100%; position: absolute; bottom: 0px; left: 0; display: flex; justify-content: space-around;}
.designfarben-container .list .series .item .color-list .color-item{width: 60px; height: 60px; border: 3px solid #FFFFFF; box-shadow: 1px 3px 8px rgba(86, 86, 86, 0.36); border-radius: 50%;}
.designfarben-container .effect{width: 592px; height: 820px; margin-top: -45px; opacity: 0; transition: opacity .3s;}
.designfarben-container .effect.active{opacity: 1;}

.sales{width: 932px; height: auto; margin: 0 auto; padding-bottom: 100px;}
.sales .banner{width: 932px; height: 414px; margin-top: 30px;}
.sales .select-wrap{width: 100%; margin: 50px 0; display: flex; display: -webkit-flex; -webkit-justify-content:space-between; justify-content:space-between;}
.sales .select-wrap select{width: 300px; height: 40px; border: 1px solid #d9d9d9; outline: none; padding: 0 10px;}
.sales .select-wrap .layui-unselect{width: 300px;}
.sales .select-wrap .layui-unselect input{height: 48px;}
.layui-form-select dl dd.layui-this{background-color: #AD9055 !important;}
.sales .select-wrap .btn{width: 260px; height: 50px; background: #232323; color: #fff; font-weight: bold; font-size: 18px; text-align: center; line-height: 50px; cursor: pointer;}
.sales .select-wrap .btn:active{opacity: .8;}
.sales .branchs{width: 100%;}
.sales .branchs table { width: 100%; display: none; border-bottom: 0px; border-collapse: collapse;}
.sales .branchs table tr{background: #f4f4f4; border-bottom: 4px solid #fff;}
.sales .branchs table td.area { height: auto; width: 120px; text-align: center; vertical-align: middle; color: #ffffff; font-size: 18px; background: #c1a362; font-weight: bold; border-right: 4px solid #fff;}
.sales .branchs table td.name {height: 80px; width: 230px; vertical-align: middle; color: #232323; font-size: 16px; font-weight: bold; padding-left: 10px;}
.sales .branchs table td.address{height: 80px; width: calc(100% - 450px); vertical-align: middle; color: #232323; font-size: 16px;}

.security{width: 1200px; height: 486px; background: #fff; margin-top: 80px; padding-top: 80px; box-shadow: 1px 4px 12px rgba(150, 150, 150, 0.33);}
.security .title{font-size: 32px; text-align: center; color: #333333;}
.security .titleEN{font-size: 20px; text-align: center; color: #999999; margin-top: 10px;}
.security .input-wrap{width: 830px; height: 77px; margin: 60px auto 100px; display: flex;}
.security .input-wrap input{width: 666px; height: 77px; border: 2px solid #cccccc; border-right: none; padding: 0 30px; font-size: 20px; transition: border-color .3s;}
.security .input-wrap input:focus{border-color: #AD9055;}
.security .input-wrap .btn{width: 164px; height: 77px; background: #AD9055; color: #ffffff; text-align: center; line-height: 77px; cursor: pointer; font-size: 20px;}
.security .input-wrap .btn:active{opacity: .9;}
.security .remark{font-size: 20px; color: #AD9055; text-align: center; font-weight: 500;}

.case{width: 1200px; position: relative; }
.case .item{width: 370px; transition: all .3s; opacity: 0;}
.case .item:hover{box-shadow: 0px 8px 24px rgba(127, 127, 127, 0.16);}
.case .item img{width: 100%; margin-bottom: 10px;}
.case .item .info{width: 100%; display: -webkit-flex; -webkit-justify-content:space-between; justify-content:space-between; -webkit-align-items:center; align-items:center; -webkit-align-content:center; align-content:center; padding: 0 10px 10px;}
.case .item .info .name,.case .item .info .texture{font-size: 16px; color: #252525;}
.case .item .info .colorNo{font-size: 16px; color: #bea05c;}
.case .item .btn{width: 110px; height: 26px; line-height: 26px; text-align: center; color: #fff; font-size: 12px; background: #3b3e43; }
.case .load-more{width: 200px; height: 50px; display: none; text-align: center; line-height: 50px; background-color: #AD9055; border-radius: 8px; position: absolute; bottom: -130px; left: 500px; color: #ffffff; font-size: 18px; cursor: pointer; z-index: 99; }
.case-loading{width: 40px; height: 40px; position: absolute; top: 0; left: 580px;}
.case-loading div{width: 10px; height: 10px;}

.case .fill { width: 1200px; margin-top: 50px; position: relative;}
.case .fill .fillitem { width: 100%; display: flex; margin-bottom: 20px;}
.case .fill .fillitem .fillname{font-size: 18px; color:#333333; font-weight: 500; }
.case .fill .fillitem .fills{ display: flex;}
.case .fill .fillitem .fills li{font-size: 18px; color: #999999; margin-left: 20px; cursor: pointer;}
.case .fill .fillitem .fills li.active{color: #AD9055;}
.case .fill .fillitem .fills li:hover{color:#AD9055; }
.case .fill .remark{font-size: 14px; color: #AD9055;}
.case .list{margin-top: 60px; position: relative;}
.case .fill .search{position: absolute; bottom: 0; right: 0; width: 198px; height: 50px; border: 2px solid #AD9055; display: flex; align-content: center; align-items: center; border-radius: 25px; justify-content: space-between;}
.case .fill .search input{width: 130px; height: 40px; border: none; outline: none; background: transparent; font-size: 18px; text-indent: 25px; }
.case .fill .search .btn{width: 60px; height: 50px; cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAA7xJREFUWEfFllFoHFUUhv9zl6wEKrqg0O1TfNMKfVBQjNCmKIqaiiBOEWl1kc650/ogiGKK4hbFKBarlOzce2mIvtSS+tCqlQoGfBCjQjVYTIu+1jboQ5S+SLKZIzdOwmazsztplvQ+DTP3nPPdc8+c8xOu86K88cfHx4uzs7MDSZJsKRQKZRG5SkRXRORXZr6Y10/zvo4AxpgHiGgfgCcA3NAqkIh8T0RnS6XScBAEc2uBaQtgrT0M4KXU4QUA0wDOE9G5hYWFW5RSW0XkTiLaCqAPwA8iMqy1Pp0XIhPAWjsO4CkAJ0XkiNZ6sp1T59x+EXk/zZJlZp0HoiWAtVZS44CZT+Zx5PeMjY1tnpubOwPgLhH5Umv9WCfbVQDOOZ/Ge5i5Y31kOTfGjBDRfgBVZj7UDmJFkKU7F5HDWuuXO9G3+26t/RPArUS0KwzDL7L2LgOk1f41Ef0YhuG96wnubeM4flgpdRbA58z8eB6Aj4lor4g8qLWeWC+AtzfGHCOi50WkP6uIFzNQrVaL5XL5HwC/M/O2bgRPAXYT0Yn01zzYyu8igLX2IQBfATjOzM90C8BaWwZwGcAkM/dnAsRx/JxSagzAEDO/0y2A9HBTAG5i5tsyAZxzQyLyNoBBZvb/cdeWc+4DEYmYuWUbX7qCFwAcTZKkEkXRR12L/n8hHieifmb2rXrVWgRwzj0pIp8CeI+ZX+kmgLX2FwB/MPMj7YrwdgAX8rbPvICjo6M31uv1WSL6MAzDpaG2wny5ETnnJkVkc1ax5A3auC+O4/uVUt8C2MfMxzIzkFbrG74lENGBMAxr1xKw2cZa+5mI7BCRgSiKfm4LUKvVSoVCwY/cvmKx2FepVGbWA2GtfRXAsIi8rrV+K8tX8zCKAPjT/8TMd18rgDFmOxFNiMjEzMzMYLVarecCSK/iBIDdIlLTWh9YK4TXBPPz858kSeI1QRBFke+wmavlzDfGnCGiRwH8lSTJnk5OlrwbY4aI6DUAXhfe7NUUMwdrBmgsSv8sIqNKqe/q9fp0b2/vVKVS+de/HxkZ2dTT0+OH1zZ/WgA7AZzy2QNQIaKnO0G0VT3OuUERCQHsajqFl+Fett3R8P5vAIdKpdLRIAgW0kP4rvpsO4hcsssYc5+HIKIBAH7CbQFwiYjOJ0kyrZT6DcBUGIZ+8KxYzjknIl7Wt7yOXABrLcTm/Q0acRXEhgCk13EEwIvNmdgwgBTiXQB+2C1nYkMBPIQx5s30V12U7BsO4CHiOPaz4Rv/fF0AGov0P0bLkzAkO6sBAAAAAElFTkSuQmCC"); background-size: 20px 20px; background-position: center; background-repeat: no-repeat;}

.sale-container{margin-top: 80px;}
.sale-container .first-title{font-size: 32px; color: #333333; font-weight: 500; text-align: center;}
.sale-container .sub-title{font-size: 20px; color: #AD9055; font-weight: 500; text-align: center; margin-top: 10px;}
.sale-container .input-wrap{width: 100%; display: flex; justify-content: space-between; margin-top: 30px;}
.sale-container .input-wrap input, .sale-container .input-wrap textarea{height: 77px; border: 1px solid #cccccc; font-size: 20px; padding: 0 25px; transition: border-color .3s;}
.sale-container .input-wrap input:focus,.sale-container .input-wrap textarea:focus{border-color: #AD9055;}
.sale-container .input-wrap input.long{width: 100%;}
.sale-container .input-wrap input.short{width: 585px;}
.address-wrap{position: relative; width: 585px;}
.address-wrap .city-picker-span{border: 1px solid #cccccc; padding: 0 25px; transition: border-color .3s;}
.address-wrap .city-picker-span.focus{border-color: #AD9055;}
.address-wrap .city-picker-span .placeholder{color: #757575; padding: 0;}
.address-wrap .city-picker-span span{font-size: 20px !important;}

.sale-container .input-wrap textarea{width: 100%; height: 260px; padding: 25px;}
.sale-container .remark{font-size: 16px; color: #999999; padding-left: 30px; margin-top: 15px;}
.sale-container .submit{margin: 100px auto; width: 224px; height: 62px; border: 2px solid #AD9055; text-align: center; line-height: 62px; font-weight: 500; font-size: 18px; color: #333333; cursor: pointer; }
.sale-container .submit:active{background-color: #AD9055; color: #ffffff;}
.sale-container .input-wrap .layui-form-checkbox{min-width: 20px; min-height: 20px;}
.sale-container .input-wrap .layui-form-checkbox span{font-size: 20px; color: #AD9055; margin-top: 1px;}
.sale-container .input-wrap .layui-form-checkbox i{width: 20px; height: 20px; line-height: 20px; }
.sale-container .input-wrap .layui-form-checkbox[lay-skin="primary"]:hover i{border-color: #AD9055 !important;}
.sale-container .input-wrap .layui-form-checked[lay-skin="primary"] i{background-color: #AD9055 !important;}

.painting-container{width: 100%; margin-top: 50px;}
.painting-container .flag{width: 925px; height: 257px; margin: 0 auto;}
.painting-container .wrap{width: 100%; background-size: top center;}
.painting-container .wrap-1{background-image: url('/static/swfarbe2022/images/painting-bg-1.jpg'); height: 800px;}
.painting-container .wrap .title{width: 100%; padding-top: 92px; position: relative; }
.painting-container .wrap .title .label{width: 100%; text-align: center; font-size: 50px; font-weight: 800; color: rgba(23, 33, 75, 0.06); position: absolute; top: 50px; left: 0;}
.painting-container .wrap .title .icon{width: 33px; height: 30px; position: absolute; top: 70px; left: 408px;}
.painting-container .wrap .title .name{font-size: 36px; font-weight: 500; color: #333333; text-align: center; width: 100%; position: absolute; top: 80px;}
.painting-container .wrap-1 .title .icon,.painting-container .wrap-3 .title .icon{background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAeCAMAAACVFoclAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTP///////////////////////////////////////////////////////////////////////////////////////1fUNLcAAAAWdFJOUwAwwGDwoCCAEEDvkHCw38/Qf1Dgv58JJ8e1AAAAxUlEQVQoz+2SaQKFIAiENc2l/W3c/6hPCxDsCvFvpo8RMWOowm80XbktNJFeABDU97wBRFZ2LwDMEojVmRLFTaB0yfyeDoU4AKULsKNzNWUCWsjAlqv8xtJnMcNV9YIrqxkjLDtHlpICxBnj2TISYHl38oQyBUlO4J5V31Ss/IOhONWMRNt46npwqkO8BxJv1P6SQyOWLhVURb2uWg/REf5GLB2x3gjbEflGiN/4JPj5GxG8JsziO8KEQRMmuUhFv6JlJ/4B0ng1E4yfLsEAAAAASUVORK5CYII="); background-size: cover; }
.painting-container .wrap-1 .title .label,.painting-container .wrap-3 .title .label{color: rgba(255, 255, 255, 0.15);}
.painting-container .wrap-1 .title .name,.painting-container .wrap-3 .title .name{color: #ffffff;}
.painting-container .wrap-1 .intro{width: 100%; margin-top: 60px; display: flex; justify-content: center; align-content: center; align-items: center; }
.painting-container .wrap-1 .intro .item{font-size: 20px; color: #ffffff;}
.painting-container .wrap-1 .intro .line{width: 1px; height: 11px; background-color: #ffffff; margin: 0 30px;}
.painting-container .wrap-1 .desc{width: 580px; position: absolute; top: 294px; right: -10px;}
.painting-container .wrap-1 .desc .item{width: 100%; height: 100px; background: rgba(36, 36, 36, 0.56); box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.16); display: flex; align-content: center; align-items: center; margin-top: 20px; padding-left: 40px;}
.painting-container .wrap-1 .desc .item:first-child{margin-top: 0;}
.painting-container .wrap-1 .desc .item .icon{width: 40px; height: 19px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAATCAYAAADiQ08DAAAAAXNSR0IArs4c6QAAARZJREFUSEvd1jFPAjEYxvHnPQb8cEyc3GcwDujBIAkhISyM4mLiZuLYnLAwMfMNmFycnBwuxIHE3PUxoAgEwpXaobEf4J9fer32leS2NpEgi6tXwxkcLxdtSQY1ktAAH3VJWlFdvbtyumivgL8g8gNAP6cMooZa/BXqor0L/BGReEOg22GaPEl3ubt2awdo2T4I3OLMwPwijJ+nNsRDwFPbRcBVj8AoyLObanP4cgq0AGjUNgJ+l5gReDgrLzqVy3FqAjUBFrXNgRtRCrKXz+U+6qrPY1Bj4JG2DXD9aV6hdSuMEyWyPAX7ywK437aNrDkk7s5jde0SuN3+lzvo6Rn0+S/2+R708yXx9y32dZrxex70fKL+AlVkakEF7LtlAAAAAElFTkSuQmCC"); background-size: cover;}
.painting-container .wrap-1 .desc .item .text{margin-left: 40px; font-size: 26px; color: #ffffff; }
.painting-container .wrap-2{margin-top: 40px;}
.painting-container .wrap-2 .title .icon,.painting-container .wrap-4 .title .icon{background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAeCAMAAACVFoclAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTBUgShcgShUgShYhShYgSxAgSBYgShAgQBQgTBYgSxcgShcgSxYgShcgShYgShYgSxcgSxYgShYgSRYgShchShchS+zcOMIAAAAWdFJOUwAwwGDwoCCAEEDvkHCw38/Qv59Qf+AAApTNAAAAxUlEQVQoz+2SaQKFIAiENc2l/W3c/6hPCxDsCvFvpo8RMWOowns0XbktNJG+ABDU97wBRFZ2LwDMEojVmRLFTaB0yXydDoU4AKULsKNzNWUCWsjAlqv8xtJnMcNV9YIrqxkjLDtHlpICxBnj2TISYHl38oQyBUlO4J5V31Ss/IehONWMRNt46npwqkO8BxIf1P6SQyOWLhVURb2uWg/REf5GLB2x3gjbEflGiN/4JPj5GxG8JsziO8KEQRMmuUhFv6JlJ/4Bzqw1E26IEwQAAAAASUVORK5CYII=");}
.painting-container .wrap-2 .title .label,.painting-container .wrap-4 .title .label{color: rgba(23, 33, 75, 0.1);}
.painting-container .wrap-2 .title .name,.painting-container .wrap-4 .title .name{color: #17214B;}
.painting-container .wrap-2 .intro{width: 100%; text-align: center; font-size: 20px; color: #808080; margin-top: 60px; line-height: 40px;}
.painting-container .wrap-2 .list{display: flex; justify-content: space-between; margin-top: 70px;}
.painting-container .wrap-2 .list .item{width: 159px;}
.painting-container .wrap-2 .list .item .icon{width: 159px; height: 148px;}
.painting-container .wrap-2 .list .item .text{font-size: 26px; color: #333333; text-align: center; margin-top: 10px;}

.painting-container .wrap-3{background-image: url('/static/swfarbe2022/images/painting-bg-2.jpg'); height: 1303px; margin-top: 130px;}
.painting-container .wrap-3 .sub-title{position: relative; width: 100%; height: 30px;}
.painting-container .wrap-3 .sub-title .line{width: 784px; height: 1px; background-color: #ffffff; position: absolute;  top: 15px;}
.painting-container .wrap-3 .sub-title .text{font-size: 26px; line-height: 30px; color: #ffffff; text-align: center;}
.painting-container .wrap-3 .sub-title-1{margin-top: 100px; }
.painting-container .wrap-3 .sub-title-2{margin-top: 190px; }
.painting-container .wrap-3 .sub-title-1 .line{left: -360px;}
.painting-container .wrap-3 .sub-title-2 .line{right: -360px;}
.painting-container .wrap-3 .list{width: 100%; display: flex; justify-content: center; margin-top: 60px;}
.painting-container .wrap-3 .list-1 .item{width: 260px; height: 260px; padding: 20px; background-color: #ffffff; margin-left: 110px;}
.painting-container .wrap-3 .list .item:first-child{margin-left: 0;}
.painting-container .wrap-3 .list-1 .item .effect{width: 220px; height: 220px;}
.painting-container .wrap-3 .list-1 .item .text{font-size: 22px; color: #ffffff; margin-top: 40px; text-align: center;}
.painting-container .wrap-3 .list-2 .item{width: 260px; height: 340px; position: relative; margin-left: 33px; overflow: hidden;}
.painting-container .wrap-3 .list-2 .item .show-model{width: 100%; height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.09) 0%, #808080 100%); border: 2px solid #FFFFFF; padding-top: 40px; }
.painting-container .wrap-3 .list-2 .item .No{font-size: 70px; color: #ffffff; text-align: center;}
.painting-container .wrap-3 .list-2 .item .line{width: 162px; height: 1px; background-color: #ffffff; margin: 30px 0 50px;}
.painting-container .wrap-3 .list-2 .item .name-zn{font-size: 24px; color: #ffffff; text-align: center;}
.painting-container .wrap-3 .list-2 .item .name-en{font-size: 16px; color: #ffffff; text-align: center; margin-top: 10px;}
.painting-container .wrap-3 .list-2 .item .hide-model{width: 100%; height: 100%; position: absolute; top: -100%; left: 0; z-index: 2; transition: top .3s; }
.painting-container .wrap-3 .list-2 .item .hide-model .effect{width: 260px; height: 275px;}
.painting-container .wrap-3 .list-2 .item .hide-model .name{width: 100%; height: 65px; background-color: #AD9055; color: #ffffff; line-height: 65px; text-align: center; font-size: 22px;}
.painting-container .wrap-3 .list-2 .item:hover .hide-model{top: 0;}
.painting-container .wrap-4{margin-top: 100px;}
.painting-container .wrap-4 .list{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 80px;}
.painting-container .wrap-4 .list .item{width: 280px; height: 330px; margin-top: 40px; }
.painting-container .wrap-4 .list .item-1{width: 382px;}
.painting-container .wrap-4 .list .item .effect{position: relative; width: 100%; height: 240px;}
.painting-container .wrap-4 .list .item .effect img{width: 100%; height: auto;}
.painting-container .wrap-4 .list .item .effect .text{font-size: 22px; color: #ffffff; text-align: center; line-height: 53px; position: absolute; bottom: 0; left: 0; background-color: #AD9055; width: 100%;}
.painting-container .wrap-4 .list .item .intro{margin-top: 10px; font-size: 16px; color: #666666; line-height: 30px;}

footer .paintingService-form{top: 100px;}
footer .paintingService-form .form-header .text{margin-left: 24px; height: 72px; display: flex; align-content: center; align-items: center; font-size: 30px; color: #AD9055; font-weight: 500;}
footer .paintingService-form .form-content{height: 513px;}
footer .paintingService-form .layui-form-select{width: 230px;}
footer .paintingService-form .layui-form-select dl{top: 60px;}