@charset "utf-8";
/* CSS Document */
/*common*/
.mb10 { margin-bottom:10px;}
.ml10 { margin-left:10px;}
.bg { background:#FFF;}
em,i{ font-style:normal; }

body{min-width: 1200px; width: 100%;}

.wz_bj{ height:127px; overflow: hidden; background: url(../images/wz_bj.jpg) no-repeat center top;font-family:"Microsoft Yahei";}
.wz{width:1200px; margin: 0 auto; overflow: hidden;}
.wz h3{width:575px;text-align: right; font-size: 30px;font-weight: normal; color:#1e1e1e; line-height: 127px; float: left;}
.wz h3 img{vertical-align: middle;}
.wz p{width:500px;padding: 36px 70px 0 0; font-size: 16px; color:#1e1e1e; line-height: 28px; overflow: hidden; float: right;}

.list_bj{height:973px; overflow: hidden; background: url(../images/list_bj.jpg) no-repeat center top;font-family:"Microsoft Yahei"; margin-top: 69px;}
.list{width:1200px; margin: 0 auto; overflow: hidden; position:relative;height:973px;}
.list_nav{ height:254px; overflow: hidden;}
.list_nav li{ float: left; margin-left: 96px;width:267px; height:254px; overflow: hidden; position: relative;}
.list_nav li a{display: block;width:267px; height:254px; }
.list_nav li span{display: block;position: absolute; top: 109px; left: 30px; background: url(../images/list_span.png) no-repeat center top; width:212px; height: 40px;text-align: center; line-height: 40px; font-size: 18px; font-weight: bold; color:#fff; overflow: hidden; }
.list_nav li a:hover , .list_nav li.cur a{ background: url(../images/list_cur1.png) no-repeat center top;}
.list_c{height:710px; overflow: hidden; position: relative;}
.list_c li {width:1200px; overflow: hidden;}
.list_c li img{width:1200px; height:569px;}
.list_c li span{display: block; padding: 50px 160px 0; font-size: 16px; line-height: 25px; color:#1d1b21;text-align: center;}
.list_ico{position: absolute; top:845px;left: 543px; width:174px; overflow: hidden;text-align:center;}
.list_ico li{display:inline-block; width:10px; height:10px; margin-right: 23px; overflow: hidden;background: url(../images/list_ico02.png) no-repeat center top; float: left;}
 .list_ico li.cur{background: url(../images/list_ico01.png) no-repeat center top;}

.line{ height:55px; overflow: hidden; background: url(../images/ico01.jpg) no-repeat center top;}

.pro {width:1201px; margin: 33px auto 0; height:486px; overflow: hidden;font-family:"Microsoft Yahei"; position: relative;}
.pro li{ float: left;width:298px; height:224px; overflow: hidden; border:1px solid #d6d6d6;position: relative;margin-right: -1px;margin-bottom: -1px;}
.pro li img{width:298px; height:224px;}
.pro li span{display: block;width:298px; line-height: 40px; font-size: 14px;font-weight: bold;text-align: center;position:absolute; bottom:0; left:0;height:40px;overflow:hidden;background:rgba(0,0,0,0.5); color:#fff;}
.pro .nomar{margin-right: 0;}
.pro h2{ background:#d6d6d6; border:1px solid #d6d6d6;position: absolute; top: 225px;right:4px;width:298px;height:224px;}
.pro h2 a{display: block;margin-top: 75px;text-align: center; font-size: 22px; color:#333333;}
.pro h2 span{display: block;width:134px; height:30px;border:1px solid #333; font-size: 16px;font-family: Arial; line-height: 30px;margin: 10px auto; text-transform: uppercase;}

.pin_bj{height:760px; overflow: hidden;margin-top: 30px; background: url(../images/pin_bj.jpg) no-repeat center top;font-family:"Microsoft Yahei";}
.pin{width:1280px; height:760px; margin: 0 auto; overflow: hidden; position: relative;}
.pin h2{position: absolute; top: 316px;left: 410px;width:460px; overflow: hidden;  font-size: 28px;font-weight: normal; color:#333;text-align: center;}
.pin h2 span{display: block;padding: 20px 40px 0; font-size: 20px; line-height: 24px; color:#1a1a1a;}
.pin dl{position: absolute; width:405px; overflow: hidden;}
.pin dt{width:80px; height:80px; float: left; overflow: hidden;}
.pin dt img{width:80px; height:80px;}
.pin dd{width:315px; float: right; font-size: 16px; color:#333; line-height: 24px;}
.pin dd b{display: block; font-size: 18px; padding:10px 0 5px; }
.pin .dl01{ top: 70px;right:170px;}
.pin .dl02{ top: 170px;right:110px;}
.pin .dl03{ top: 275px;right:10px;}
.pin .dl04{ top: 397px;right:10px;}
.pin .dl05{ top: 505px;right:110px;}
.pin .dl06{ top: 608px;right:170px;}

.coo{width:1200px; margin: 80px auto 0;  overflow: hidden;font-family:"Microsoft Yahei"; position: relative;}
.coo h2{height:197px; text-align: center; font-size: 38px;color:#202020; overflow: hidden;}
.coo h2 a{ color:#333; line-height: 50px;}
.coo h2 i{display: block;padding-top: 10px; font-size: 12px; font-family: Arial;font-weight: normal; text-transform: uppercase; }
.coo h2 span{ font-size: 18px;font-weight: normal; padding-top: 15px;display: block;}
.coo p{width:770px; height: 278px; overflow: hidden; margin-left: 430px;}
.coo p img{width:770px; height: 278px;}
.coo div{float:left;}
.coo dl{ margin-top: 10px; height:300px; overflow: hidden; margin-left: 430px;}
.coo dt{width:385px; height:278px;  overflow: hidden; float: left;}
.coo dt img{width:385px; height:278px;}
.coo dd{ float: right;width:375px; height: 278px; overflow: hidden;background: url(../images/exper03.jpg) no-repeat center 0;}
.coo dd a{display: block;margin:110px 0 0 15px; font-size: 20px;color:#1e1e1e;font-weight: bold; line-height: 24px;}
.coo dd span{ color:#ffbd29;}
.coo dd i{display: block; font-size: 16px; color:#1e1e1e; font-weight: normal;font-family: Arial ; display: block;margin-left: 15px; margin-top: 10px; text-transform: uppercase;}
.coo h3{ position: absolute; top: 760px ; left: 65px;font-size: 24px;color:#1e1e1e;font-weight: bold; line-height: 24px;}
.coo h3 a{ color:#1e1e1e;}
.coo h3 i{display: block; font-size: 16px; font-weight: normal;font-family: Arial ; display: block; margin-top: 10px; text-transform: uppercase;}

.news{width:898px;overflow: hidden;font-family:"Microsoft Yahei"; float: left;}
.news_nav{height:35px; background:#5a5657; overflow: hidden;padding: 0 20px;}
.news_nav li{float: left;position:relative;}
.news_nav li:first-child:after{content: "/";font-size: 16px;display: block;color: white;position: absolute;right: 0;top: 7px;font-style: italic;}
.news_nav li a{ font-size: 16px; color:#fff; line-height: 35px;padding: 0 15px 0 10px; display: inline-block;font-weight: bold;}
.news_nav li a:hover , .news_nav .cur a{ color:#a51745;}

.news_nav span{display: inline-block; width:53px; height: 18px; border-radius: 20px;font-family: Arial ; border:1px solid #fff; margin-top: 8px;text-align: center; line-height: 18px;}
.news_nav span a{ color:#fff; font-size: 12px;}
.news_nav .nobg{background:none;}
.news_nr{height:390px; border:1px solid #ebebeb; overflow: hidden;}
.news1{width:404px; overflow: hidden;margin:17px 0 0 15px;}
.news1 dt{height:227px; border-bottom: 1px dashed #e5e5e5; overflow: hidden;}
.news1 dt img{width:100%; }
.news1 dd{ padding-top: 32px;  overflow: hidden;}
.news1 dd span{display: block; float: left; font-size: 20px;color:#1d1b21; font-family: Arial; overflow: hidden;width:80px;text-align: center;}
.news1 dd span img{display: block;margin: 5px auto;}
.news1 dd h3{width:320px; overflow: hidden;font-size: 14px;font-weight: normal;}
.news1 dd h3 a{ color:#333;display: block;}
.news1 dd p{ color:#666; padding-top: 10px;}
.news2{width:375px; padding: 0 30px 0 0; overflow: hidden;}
.news2 dl{margin-top: 18px;height: 103px; border-bottom: 1px dashed #e5e5e5; overflow: hidden;}
.news2 dt{ font-size: 14px; line-height: 24px;}
.news2 dt a{ color:#333;}
.news2 dd{padding-top: 3px; color:#666; line-height:20px;}
.news2 dd a{display: block; padding-top: 10px; font-size: 14px; color:#333;}

.wt{width:274px; height:500px;overflow: hidden; float: right; font-family:"Microsoft Yahei"; position: relative;}
.wt h2{height:35px; background:#5a5657; overflow: hidden;padding: 0 20px; font-size: 16px; line-height: 35px;}
.wt h2 a{ color:#fff;}
.wt_prev{top: 268px; position: absolute;left: 28px; width:11px; height:18px; overflow: hidden;background: url(../images/wt_ico.gif) no-repeat 0 0; z-index: 4;}
.wt_next{top: 268px; position: absolute;right: 28px; width:11px; height:18px; overflow: hidden;background: url(../images/wt_ico1.gif) no-repeat 0 0; z-index: 4;}
.wt_c{overflow: hidden;}
.wtnr dl{ overflow: hidden;}
.wtnr dt{width:274px; height:202px;}
.wtnr dt img{ width: 100%;margin-top: 15px;}
.wtnr dd{ border:1px solid #ebebeb; height:188px; overflow: hidden;}
.wtnr dd h3{padding-top: 26px; font-size: 14px;text-align: center;font-weight: normal;}
.wtnr dd p{padding: 16px 15px 0 ; line-height: 20px;}

.about_bj{height:350px; overflow: hidden;font-family:"Microsoft Yahei";}
.about{width:1200px; margin: 0 auto; overflow: hidden;  }
.about dd p{ font-size: 14px; line-height: 30px; color:#5a5657; overflow: hidden;}
.about dd h2{color:#5a5657;text-align:center;font-weight: normal;margin: 80px 0 20px;}
.about dd h4{color:#5a5657;text-align:center;font-weight: normal;margin: 0 0 30px;}
.about dd .icon-box{display:flex;justify-content: center;}
.about dd .icon-box p{    margin: 10px 30px;}
.about dd .icon-box p a{color:#fff;display: block;text-align: center;  font-size: 18px;}
.about dd .icon-box p a:hover{text-decoration: underline;}

.serv_bj{overflow: hidden;font-family:"Microsoft Yahei";}
.serv{width:1200px; margin: 0 auto; overflow: hidden;}
.security_list{height:125px;}
.security_list li{width: 147px;float: left;  height: 15px; margin-top: 45px; cursor:pointer;}
.security_list li a{width: 147px; display: block; text-align: center;  color:#898989; font-size:14px;}
.security_list li a span{display:inline-block;     border-radius: 50%;
    border: 1px solid;
    height: 32px;
    width: 32px;line-height: 34px; margin-bottom:10px;}
.security_list li>span{display: inline-block;text-align: center; width: 100%; color: #919191;}

.shop_mall{width:1200px; margin: 30px auto 0; overflow: hidden;}
.shop_mall ul{display:flex;    flex-wrap: wrap;justify-content: space-between;}
.shop_mall ul li{width:24%; margin-bottom:2%;}
.shop_mall ul li img{width:100%; }

.hr{    margin: 40px auto 20px;width: 1190px;}

.hotranklist{  width: 1190px; margin: 0 auto;}
.hrl-banner{ margin-top: 40px;}
.hrl-broad{ overflow: hidden;}
.hrlb-left{ float: left;width: 902px; overflow: hidden; border: 1px solid #EEEEEE; margin-top: 15px;}
.hrlb-left a{ display: inline-block; width: 150px; height: 130px; float: left; text-align: center; box-sizing: border-box; border-bottom: 1px solid #EEEEEE; border-right: 1px solid #EEEEEE;}
.hrlb-left a p{  margin-top: 20px; font-size: 12px; color: #888;}
.hrlb-left a img{ width:  120px; height: 60px; object-fit: contain; margin-top: 20px; }
.hrlb-left a:nth-child(6n+6){ border-right: none;}
.hrlb-left a:nth-last-child(1),.hrlb-left a:nth-last-child(2),.hrlb-left a:nth-last-child(3),.hrlb-left a:nth-last-child(4),.hrlb-left a:nth-last-child(5),.hrlb-left a:nth-last-child(6){ border-bottom: none;}
.hrlb-right{ float: right; width: 263px; border: 1px solid #EEEEEE;   margin-top: 15px;}
.hrlb-right .hotlisttop{ border-bottom:  2px solid #4c9c7a; background: url("../images/hotlisttitlebg.png") no-repeat 12px 17px; height: 60px; padding-left: 50px; line-height: 60px; font-size: 18px; color: #4c9c7a;}
.hotlistrank .hlr-item{ height: 66px; line-height: 66px; border-top: 1px solid #EEEEEE;}
.hotlistrank .hlr-item span{ float: left; width: 27px; border-radius: 50%; line-height: 27px; margin-left: 14px; margin-top: 18px; background: #b9b9b9; display: inline-block; color: #ffffff; font-size: 16px; text-align: center;}
.hotlistrank .hlr-item img{ float: left; width: 71px; height: 35px; object-fit: contain; margin-top: 14px; margin-left: 30px;}
.hotlistrank .hlr-item p{ float: left; margin-left: 15px; font-size: 14px;  width: 96px; overflow: hidden; white-space: nowrap;text-overflow: ellipsis;}
.hotlistrank .hlr-item:nth-child(1) span{ background: url("../images/ranklistbg.png") no-repeat center; }
.hotlistrank .hlr-item:nth-child(2) span{ background: url("../images/ranklistbg.png") no-repeat center; }
.hotlistrank .hlr-item:nth-child(3) span{ background: url("../images/ranklistbg.png") no-repeat center; }

.hrlbs-left{ float: left;width: 902px; overflow: hidden; border: 1px solid #EEEEEE; margin-top: 15px; border-bottom: none;}
.hrlbs-right{ float: right; width: 263px; border: 1px solid #EEEEEE;   margin-top: 15px;}
.hrlbs-right .hotlisttop{ border-bottom:  2px solid #4c9c7a; background: url("../images/hotlisttitlebgs.png") no-repeat 12px 17px; height: 60px; padding-left: 50px; line-height: 60px; font-size: 18px; color: #4c9c7a;}

.hrlbs-left .hrlbsl-item{ width: 300px; float: left; border-bottom: 1px solid #EEEEEE; border-right: 1px solid #EEEEEE; padding-bottom: 15px;}
.hrlbsl-img{ width: 208px; overflow: hidden; margin: 20px auto;}
.hrlbsl-img img{ width: 100%; -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s;}
.hrlbsl-img:hover img{ -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1); -ms-transform: scale(1.1,1.1); -o-transform: scale(1.1,1.1); transform: scale(1.1,1.1);}
.hrlbsl-item h1{ font-size: 14px; text-align: center; font-weight: normal; height: 30px; line-height: 30px; margin-top: 20px; position: relative;}
.hrlbsl-item h1:after{ display: inline-block; width: 127px; content: ''; border-bottom: 1px solid #EEEEEE; position: absolute; top: -10px; left: 50%; margin-left: -63px;}
.hrlbsl-item p{ font-size: 14px; color: #bd4340; text-align: center;}

.hrlbsl-item:nth-child(3n+3){border-right: none;}
.hotlistopl{ padding-top: 5px; padding-left: 15px; padding-bottom: 28px;}
.hotlistopl .hotlistitem{ margin-top: 30.2px; overflow: hidden;}
.hotlistitem .hli-img{ width: 85px;border: 1px solid #EEEEEE; float: left; position: relative;}
.hotlistitem .hli-img span{display: inline-block; width: 18px; height: 22px; top: 0; left: 0; position: absolute; background: url("../images/goodslist2.png") no-repeat 0 -1px; color: #ffffff; font-size: 12px; text-align: center; line-height: 17px; }
.hotlistitem:nth-child(1) .hli-img span,.hotlistitem:nth-child(2) .hli-img span,.hotlistitem:nth-child(3) .hli-img span{ background: url("../images/goodslist1.png") no-repeat 0 -1px; }
.hli-img img{ width: 100%;display: block;}
.hotlistitem .hli-mes{ width: 130px; height: 85px; float: right; margin-right: 5px; overflow: hidden; }
.hli-mes h1{ font-size: 12px; font-weight: normal; width: 100%; overflow: hidden; line-height: 28px; text-overflow: ellipsis; white-space: nowrap;}
.hli-mes p{ font-size: 14px; color: #bd4340;}
.hli-mes>a{ display: inline-block; width: 77px; margin-top: 10px; float: left; height: 26px; line-height: 26px; text-align: center; font-size: 14px; border: 1px solid #EEEEEE; border-radius: 3px;}

.Find-inspiration{ width: 1190px; margin: 0 auto 30px; }
.f-inspiration{ padding-top: 60px;}
.f-inspiration h1{ text-align: center; font-size: 26px; color: #000; font-weight: bold; line-height: 40px; letter-spacing: 2px;}
.f-inspiration p{ text-align: center; font-size: 16px; color: #666666; line-height: 30px; margin-top: 12px;}
.f-ist-choice{ margin-top: 50px; text-align: center; height: 96px; overflow: hidden;}
.f-ist-choice a{ height: 94px; width: 94px; line-height: 94px; margin-right: 38px; text-align: center; font-size: 16px; color: #000000; border: 1px solid #666666; display: inline-block; border-radius: 50%; cursor: pointer;}
.f-ist-choice a:nth-last-child(1){ margin-right: 0;}
.f-ist-choice a:hover{background: #a51745; border: 1px solid #a51745; color: #ffffff !important;}

.f-ist-imgarr{  margin-top: 60px; overflow: hidden;}
.f-ist-imgarr div{border: 1px solid #e9e9e9;}
.f-ist-imgarr div a{ text-align: center;}
.f-ist-imgarr div a img{ width: 100%;}
.f-ist-imgarr div a img{ -webkit-transition: all 2s; -moz-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s;}
.f-ist-imgarr div a:hover img{ -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1); -ms-transform: scale(1.1,1.1); -o-transform: scale(1.1,1.1); transform: scale(1.1,1.1);}
.f-ist-imgarr div p{ line-height: 60px; text-align: center; font-size: 16px;  color: #000000;}
.f-ist-imgarr div:nth-child(1){ float: left; width: 586px; margin-bottom: 25px;}
.f-ist-imgarr div:nth-child(1) a{height: 350px; overflow: hidden; width: 100%; display: inline-block;}
.f-ist-imgarr div:nth-child(2){ float: right; width: 586px; margin-bottom: 25px;}
.f-ist-imgarr div:nth-child(2) a{height: 350px; overflow: hidden; width: 100%; display: inline-block;}
.f-ist-imgarr div:nth-child(3){ float: left; width: 380px; }
.f-ist-imgarr div:nth-child(3) a{height: 285px; overflow: hidden; width: 100%; display: inline-block;}
.f-ist-imgarr div:nth-child(4){ float: left; width: 380px; margin-left: 25px;}
.f-ist-imgarr div:nth-child(4) a{height: 285px; overflow: hidden; width: 100%; display: inline-block;}
.f-ist-imgarr div:nth-child(5){ float: right; width: 380px; }
.f-ist-imgarr div:nth-child(5) a{height: 285px; overflow: hidden; width: 100%; display: inline-block;}