@import url("responsive2.0.css");

.header .top_w{position: fixed;z-index: 100; left: 0;top: 0;width: 100%; transition: 0.5s; background: #fff}
.header .logo{width:35%; max-width: 215px; padding: .05rem 0}
.header .language {margin-left: 3vw; position: relative}
.header .language dt{padding-left:36px; padding-right: 32px; position: relative;}
.header .language dt:before,
.header .language dt:after{content: ''; position: absolute; top: 0; bottom: 0; margin: auto; background: no-repeat center center; background-size: 100%}
.header .language dt:before{left: 0; width:22px; height: 22px; background-image: url("../images/language.svg")}
.header .language dt:after{right: 0; width: 13px; height: 6px; background-image: url("../images/jt.png");}
.header .language dd{position: absolute; display: none; width: 100%; text-align: center}
.header .topmenu{background: #333333}
.header menu li{position: relative}
.header menu li span,
.header menu li span a{display: block;}
.header menu li span a{color: #181818; transition: 0.5s; text-transform: uppercase}
.header menu li .sub{display: none;}
.header menu li .sub a{display: block;line-height: 34px;}
.header menu li .sub a:hover{opacity: 0.8}
.header menu li .sub dl{padding: 10px 0;}
.header menu li .sub dl dt{padding: 0 10px;width: 100%}
.header .top-search{display: block; padding: 0;}
.header .top-search a{display: block;width: 30px; height: 30px; cursor: pointer; background: no-repeat center center url(../images/search.svg); transition: 0.5s}
.header .top-search .box{position:absolute;right: 0; display: none;width:360px;background: #fff; border-radius:4px; border: solid 1px #cbcbcb}
.header .top-search .box .text{width:calc(100% - 40px);display: block;background: none; border: 0;}
.header .top-search .box .text.focus{color: #000;}
.header .top-search .box .btn{position: absolute; right:5px; top:5px;}
.header .open-search.on:after,
.header .open-search.on:before{background-color: #f3a125;}
.header.show .top_w{box-shadow: 0 0 10px rgba(0,0,0,0.1)}
@media (min-width:1025px) {
.header .top-search .open-search{display: none}
.header .top-search .box{display: block; position: relative}

.header menu li{line-height:.46rem;}
.header menu li span{position: relative;z-index: 10}
.header menu li span a{color: #fff; padding: 0 2.9vw}
.header menu li.aon span a{background-color:#f3a124}
.header menu li .sub{position: absolute;background:rgba(243,161,37,0.9);left:50%;transform: translateX(-50%); min-width: 100%; z-index: -1; white-space: nowrap}
.header menu li .sub dt{transition: 0.5s}
.header menu li .sub dt:hover{background:rgba(243,161,37,0.98);}
.header menu li .sub a{display: block;color: #fff; text-align: center}
.header menu li .sub dt:not(:last-child) aside{padding-right:1rem}
}

@media (max-width:1024px) {
.header .language dt{padding-left:26px;padding-right:20px;font-size: .16rem}
.header .top-search .box{width: 90%; left:5%; right:5%;position: fixed}
.header menu{position: fixed; left: -100%;top:0;height: calc(100vh); background-color: #fff;opacity: 0;transition: 0.5s;box-shadow: 0 5px 5px rgba(0,0,0,0.1); width:50vw; max-width: 240px;}
.menu-show .header menu{left: 0; opacity: 1;}
.header menu ul{padding: 20px 0; height: 100%; overflow: auto; display: block}
.header menu li{border-bottom: 1px dotted #c6c6c6;}
.header menu li span{line-height: 3; padding-left:1em;}
.header menu li .sub dl{display: block;padding:0 0 0 1em}
.header menu li.has-sub span .op,
.header menu li.has-sub span:after{width: 20%}
.open-menu {margin-left: 20px; width:34px;height:24px; display: flex;flex-wrap: wrap;flex-direction: column;justify-content: space-between;transition: 0.3s;}
.open-menu span {display: block;transition: 0.3s;height: 2px;background-color: #f3a124;}
.menu-show  .open-menu{border-radius: 50%; background-color: #f3a124;padding: 8px; height:34px; }
.menu-show  .open-menu span{background-color: #fff; height: 1px;}
}

.close{position: absolute;right:10px;top:10px;z-index: 10;width: 30px;height: 30px;border-radius: 50%;background: linear-gradient(45deg,#f48221,#ff6e03);cursor: pointer;}
.close::before,
.close::after{ position:absolute; content:''; width:3px; height:70%; border-radius:3px; background-color:#fff; left:13px; top:5px;}
.close::before{ transform:rotate(45deg);}
.close::after{ transform:rotate(-45deg);}

.footer{ background-color: #e8e8e8; text-align: center}
.footer,
.footer a:not(:hover){color: #666666}
.footer .follow_us{padding-top:4%;}
.footer .follow_us li{padding: 0 0.8vw}
.footer .follow_us li img{max-height: .35rem; transition: 0.5s}
.footer .follow_us li a:hover img{transform: scale(1.1); opacity: 0.8}
.footer .column{padding:2% 0}
.footer .column li{text-transform: uppercase;}
.footer .column li:last-child i{display: none}
.footer .column i{font-style: normal; padding: 0 2vw}
.footer .copyright{padding: 1% 0; border-top: solid 1px #dddddd}

.banner{position: relative}
.banner img{width: 100%}
.banner .wap{display: none}
.banner .info{position: absolute; width: 100%;top:50%; transform: translateY(-50%); z-index: 10}
.banner .info p{padding:2.5%; color: #fff; max-width: 400px; background: #f3a125; line-height: 1.45}
@media (max-width:1024px) {
.banner .wap{display:block}
.banner .pc{display: none}
}

.location{padding: 0.1rem 0}
.location,
.location a:not(:hover){color: #999999}
.location i{font-style: normal; padding: 0px 5px;}

.menubox{width: 100%;background-color: #fff;}
.menubox.fixed{position: fixed;top: 0;z-index: 999;}
.side_menu{padding: 1% 0;}
.side_menu dt{display: none}
@media(min-width:1024px){
.side_menu dd {display: block!important}
.side_menu dd ul{margin: 0 -2px;}
.side_menu dd li{padding: 2px;flex: auto; text-align: center;}
.side_menu dd li a{background: #ebebeb; display:flex; justify-content: center; align-items: center; height: 60px; line-height: 20px;}
.side_menu dd li span:after{content: ''; position: absolute; width: 100%; height: 3px; left: 0; bottom: -.3rem}
.side_menu dd li.aon a{ color: #ffffff; background: #f3a125}
}
@media(max-width:1024px){
.side_menu{z-index: 10; padding-top: .1rem}
.side_menu dl{position: relative;}
.side_menu dt{display:block; text-align: center;background: #f3a125; padding: .05rem; color: #fff; border-radius: 10px 0 10px 0;}
.side_menu dt img{height: .4rem; position: absolute; right: 2%; top: 0; bottom: 0; margin: auto}
.side_menu dd{position: absolute; display: none; width: 100%; background: #fff; z-index: 10;box-shadow: 0 10px 10px rgba(0,0,0,0.1)}
.side_menu dd li{width: 100%;}
.side_menu dd li a{padding: .1rem .2rem;display: block; border-top: solid 1px #ddd}
}

.title_line{border-bottom: solid 1px #dddddd; padding: .20rem 0; line-height: 18px; margin-bottom: 0.1rem}
.title_line:before{content: ''; width: 3px; height: 18px; margin-right: 17px; background: #f3a125; display: inline-block}

.product_select{max-width: 620px;  position: relative; z-index: 10}
.product_select dl{flex: auto;position: relative;}
.product_select dl:not(:last-child){margin-right: .3rem}
.product_select dt{padding:.06rem 1vw; border: solid 1px #dbdbdb; border-radius: 4px;position: relative; cursor: pointer}
.product_select dt:after{content: ''; position: absolute; top: 0; bottom: 0; right: 0;border-radius: 100%; margin: auto; width:.45rem; height:.45rem; background:#fff url(../images/jt.png) no-repeat center center; background-size: 13px; transition: 0.5s}
.product_select dd{position: absolute; width: 100%; background: #fff; border: solid 1px #dbdbdb; display: none}
.product_select dd li{border-top: solid 1px #dbdbdb}
.product_select dd li a{display: block;padding:0.02rem 1vw; }
.product_select dd li a:hover{background: #eeeeee}
.product_select dl.click dt:after{transform: rotate(180deg)}
@media(max-width:1024px){
.product_select dl:not(:last-child){margin-right: .1rem}
}
@media(max-width:768px){
.product_select dl{width: 100%;}
.product_select dl:not(:last-child){margin-right:0; margin-bottom: .2rem}
}

.product_series{padding-bottom: 4%}
.product_series ul{margin: 0 -0.735%}
.product_series li{width:14.28571428571429%; padding:0.735%}
.product_series li a.on{color: #f3a125;text-decoration: none;}
.product_series .pic figure{border-radius: 100%}
.product_series .txt{text-align: center; padding: .2rem 0}
@media(max-width:1024px){
.product_series li{width:20%;}
}
@media(max-width:768px){
.product_series li{width:25%;}
}

.view .pic span{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #fff; background: url("../images/search2.svg") no-repeat center top;padding-top: .35rem; z-index: 2; opacity: 0; transition: 0.5s}
/* .view .pic:before{content: ''; position: absolute; width: 100%; height: 100%; background: #f3a125; opacity: 0; z-index: 1;transition: 0.4s} */
.view .item:hover .pic:before{opacity: 0.8}
.view .item:hover .pic span{opacity: 1}


.product_list ul{margin: 0 -1.5059%}
.product_list li{width: 20%; padding:0.8% 1.5059%}
.product_list .pic figure{padding-bottom:139.585%}
.product_list .txt{text-align: center; line-height:3}
@media(max-width:1024px){
.product_list li{width:33.333%;}
}

.other_photo{padding: 2% 0}
.other_photo h3{line-height: 3; border-bottom: solid 1px #dddddd; margin-bottom: .4rem; text-transform: uppercase}
.other_photo h3:after{content: '';display:block; width: .7rem; height: .03rem; background: #f3a125; margin-bottom: -1px;}
.other_photo .list{margin: 0 -5px}
.other_photo .item{width: 20%; padding:5px}
.other_photo .item a{display: block; position: relative}
.other_photo .pic figure{padding-bottom:139.71%}
.other_photo .txt{color: #fff; position: absolute; width: 100%; bottom: 0; background: rgba(243,161,36,0.96); padding:3% 5%; opacity: 0; transition: 0.5s}
.other_photo .txt h4{text-transform: uppercase; line-height: 1.35}
.other_photo .item:hover .txt{opacity: 1}
.other_photo .btn{text-align: center; padding-top:3%; padding-bottom: 3%}
.other_photo .btn a{color: #f3a125; border: solid 1px #f3a125; padding: .12rem 6vw; display: inline-block; transition: 0.5s}
.other_photo .btn a:hover{background-color: #f3a125; color: #fff}
@media(max-width:1024px){
.other_photo .item{width:33.333%;}
.other_photo .btn a{padding: .05rem 6vw; }
}
@media(max-width:1024px){
.other_photo .txt h4{font-size: .16rem}
}

.inspiratio_list ul:after{content: '';}
.inspiratio_list ul:after,
.inspiratio_list li{width:32.143%}
.inspiratio_list li{padding-bottom:.1rem}
.inspiratio_list .pic figure{padding-bottom:71.112%}
.inspiratio_list .txt{text-align: center; line-height:3}
@media(max-width:1024px){
.inspiratio_list ul:after{display: none}
.inspiratio_list li{width:48%}
}

.download_list {padding-top:3%}
.download_list li{width: 49%;padding-bottom: 2%}
.download_list li *{transition: 0.5s}
.download_list li a{display: flex; align-items: flex-start; justify-content: space-between; border: solid 1px #dddddd; padding: .14rem}
.download_list li span{position: relative;padding-top: .1rem; padding-bottom: .1rem; line-height: .2rem}
.download_list li span:before{content: '';top: 0; position: absolute;height:.4rem;background: no-repeat center center;background-size: 100%}
.download_list li .icon{padding-left: .5rem}
.download_list li .icon:before{left:0;width:26px; background-image: url("../images/file.svg")}
.download_list li .btn{padding-left: .45rem;padding-right: .21rem; background-color: #ebebeb; border-radius: 2px}
.download_list li .btn:before{left:.2rem;width: 17px; background-image: url("../images/down.svg")}
.download_list li .time{ flex-shrink: 0; margin-left: .1rem;}

.download_list li a:hover{border-color: #f3a125}
.download_list li a:hover .icon{color: #f3a125}
.download_list li a:hover .btn{color: #fff; background-color: #f3a125}
.download_list li a:hover .btn:before{filter: brightness(0) invert(1);}
.news_list li .icon{ padding-left: 0;}
.news_list li .icon:before{ display: none;}
.news_list {}
@media(max-width:1024px){
.download_list li{width:100%}
.download_list li .btn{padding-left: .35rem;padding-right: .10rem;}
.download_list li .btn:before{left:.1rem;}
.download_list li .icon{padding-left: 20px}
.download_list li .icon:before{width: 15px}

}


.contact{padding-top: 2%; padding-bottom:8%}
.contact .article{flex: 1}
.contact .title{border-bottom: solid 1px #dddddd; text-transform: uppercase; line-height: 1.5; padding-right: 3%; padding-bottom: 4%}
.contact .info{padding-top: .4rem}
.contact .photo{width:39.572%; margin-left:4.715%;}

.editor_contact li:not(:last-child){margin-bottom: .2rem}
.editor_contact figure{display: flex; justify-content: center; align-items: center; width: .42rem; height: .42rem; border: solid 1px #f3a125; border-radius: 4px; margin-right:.18rem} 
.editor_contact p{flex:1}

@media(max-width:768px){
.contact .article{flex: auto; width: 100%}
.contact .photo{width: 100%; padding-top: 5%}
}


.search_list li{position: relative; border-bottom: solid 1px #e5e5e5;padding: 1% }

.search_list li h4{padding-right: 60px;}
.search_list li h4 span{padding-right: 10px;color: #adadad}
.search_list li time{color: #999999;}
.search_list li .icon{width: 54px; height: 54px; position: absolute; margin: auto; right: 0; top: 0; bottom: 0; border: solid 1px #ebebeb; border-radius: 100px; transition: 0.5s}
.search_list li .icon:before{content: '';position: absolute; width: 100%; height: 100%;transform: rotate(-90deg); background: url(../images/jt.png) no-repeat center center; background-size: 13px}
.search_list li:hover .icon{background-color: #f3a125; border-color: #f3a125}
.search_list li:hover .icon:before{filter: brightnefullpage ss(0) invert(1);}
@media(max-width:768px){
.search_list li .icon{width: 40px; height: 40px; }
.search_list li h4{font-size: .16rem;}
}


.product_details{padding-top:2%; padding-bottom: 8%; align-items: flex-start}
.product_details .photo{width:55.715%; text-align: center}
.product_details .big_pic{width:82.052%;}
.product_details .big_pic figure{padding-bottom: 85%}
.product_details .small_pic{width:15.385%;order: -1; padding: .5rem 0; position: relative}
.product_details .small_pic .item{padding: 4px 0}
.product_details .small_pic figure{padding-bottom:116.67%;cursor: pointer; }
.product_details .small_pic .slick-current figure:before{content: '';position: absolute;left: 0;top:0; width: 100%; height: 100%;border: solid 3px #f3a125;z-index: 2}

.product_details .details{width:40%}
.product_details .details table{width: 100%;}
.product_details .details table tr:nth-child(odd){background: #f7f8f8}
.product_details .details table tr:first-child{background: #ebebeb}
.product_details .details table tr:first-child td{font-size: .18rem}
.product_details .details table td{border: solid 2px #fff;padding:12px .2rem; line-height: 22px;}
.product_details .details table td:first-child{white-space: nowrap}
.product_details .btn{padding-top: .35rem}
.product_details .btn a{color: #fff;cursor: pointer; line-height: .5rem; border-radius: 4px; display: inline-block; padding-left: 30px; padding-right: 67px; background: #f3a125 url("../images/message.svg") no-repeat 90%}
@media(min-width:768px){
.product_details .small_pic .slick-prev,
.product_details .small_pic .slick-next{left: 0; right: 0; top: 0;width: 100%;height: .5rem; border-radius: 0; margin: auto; -webkit-transform: translate(0, 0);  transform: translate(0, 0)}
.product_details .small_pic .slick-prev{top: 0; }
.product_details .small_pic .slick-next{bottom: 0; top: auto}
.product_details .small_pic .slick-arrow:before{transform: rotate(90deg)}
}
@media(max-width:1024px){
.product_details .photo,
.product_details .details{width:100%; }
.product_details .details{padding-top: 4%}
.zoomContainer{display: none!important}
}
@media(max-width:768px){
.product_details .big_pic,
.product_details .small_pic{width: 100%}
.product_details .small_pic{padding: .1rem .5rem; order: 2}
.product_details .small_pic .item{padding:.1rem}
.product_details .photo,
.product_details .details{width: 100%}
.product_details .details{padding-top: 6%}
}

.message_form{position: fixed; top:0; width: 100%; height: 100%; z-index: 1100;background: rgba(0,0,0,0.9);display: none}
.message_form .inbox{max-width: 900px; width: 90%;padding: 4% 0; background: #fff url("../images/message2.svg") no-repeat 105% bottom;    background-size: 34%; position: absolute; left: 50%; top:50%; transform: translate(-50%, -50%)}
.message_form h3{text-align: center; text-transform: uppercase}
.message_form .form_table{width: 90%; max-width: 540px; margin: auto}
.message_form .form_table td{padding: 15px 0; vertical-align: top;}
.message_form .form_table td.name{text-align: right;width: 1rem}
.message_form .text{width: 100%; height: 44px; border: solid 1px #dfdfdf; border-radius: 4px;}
.message_form .btn{width: 45%; height: .5rem; background: #f3a125; color: #fff; cursor: pointer;border: none; border-radius: 4px; transition: 0.5s}
.message_form p{ margin: 0;}
.message_form .btn:hover{background: #000}

.Pages{padding:6% 0}
.Pages span:not(.p_page),
.Pages a.a_first,
.Pages a.a_end{display: none}
.Pages .p_page{display: flex; justify-content: center}
.Pages .num{display: flex;font-style: normal; padding: 0px 1vw;}
.Pages a{width:46px;height: 46px;line-height:46px; margin: 0px 0.5vw; text-align: center; display: block; background: #fff; border: solid 1px #dddddd}
.Pages a.a_cur{background: #f3a125;border-color: #f3a125; color: #fff;}
.Pages a.a_prev,
.Pages a.a_next{text-indent: 100px;overflow: hidden;position: relative}
.Pages a.a_prev:before,
.Pages a.a_next:before{content: ''; position: absolute; width: 100%; height: 100%; left: 0;background: url(../images/page.svg) no-repeat center center}
.Pages a.a_next{transform:rotate(180deg)}
.Pages a.no{ cursor: default;opacity: 0.5}

@media(max-width:768px){
.Pages a{width:36px;height:36px;line-height:36px;}
.Pages .num{padding: 0}
}

div[rel="CommonSliding"][data-rel="showfirst"] .group .box{display: none}
div[rel="CommonSliding"][data-rel="hideall"] .group .box{display: none}
div[rel="CommonSliding"] .title{cursor: pointer}

/*index*/
.ind_banner{position: relative}
.ind_banner img{width: 100%}
.ind_banner .wap{display: none}
.ind_banner .infobox{position: absolute; width: 100%;top:50%; transform: translateY(-50%); z-index: 10}
.ind_banner .txt{padding:2%; color: #666666; width: 50%; background:rgba(255,255,255,0.95); line-height: 1.45}
.ind_banner .p1{text-transform: uppercase; padding-bottom: 2%}
.ind_banner .p2{width: 80%}
.ind_banner .link {padding-top: 2%}
.ind_banner .link a{color: #fff; background: #f3a124;padding: .15rem .1rem; display: inline-block;text-transform: uppercase}
@media (max-width:1024px) {
.ind_banner .wap{display:block}
.ind_banner .pc{display: none}
.ind_banner .txt{width: 70%}
}

div[rel=ind]{padding: 4% 0}
@media (max-width:1710px) {
div[rel=ind]{padding: 4% .2rem}
}

.ind_title{padding-bottom: 2%}
.ind_title h3{text-transform: uppercase; font-weight: normal;font-size: .28rem;}
.ind_title a{border-bottom: solid 1px #333; line-height: 1}

.ind_product .list{margin: 0 -13px}
.ind_product .item{padding:0 13px;}
.ind_product .pic figure{padding-bottom:140.625%}
.ind_product .txt{text-align: center; padding: .1rem 0}
.ind_product .txt h4{text-transform: uppercase; }
@media (max-width:768px) {
.ind_product .list{margin: 0 -5px}
.ind_product .item{padding:0 5px;}
}

.ind_new_pro {background: #f7f7f7}
.ind_new_pro .item{width:49.118%}
.ind_new_pro .pic figure{padding-bottom:50%}
.ind_new_pro .txt{color: #fff; position: relative; width: 100%; background: rgba(243,161,36,0.96); padding:1.5% 5%;line-height: 1;}
.ind_new_pro .txt h4{text-transform: uppercase;margin-bottom: 1%;}
@media (min-width:768px) {
.ind_new_pro .item:nth-child(2) ~ .item{margin-top: 1.764%}
}
@media (max-width:768px) {
.ind_new_pro .item{width:100%}
.ind_new_pro .item:nth-child(1) ~ .item{margin-top: 1.764%}
}

.ind_photo .list{margin: 0 -17px}
.ind_photo .item{padding:0 17px;}
.ind_photo .pic figure{padding-bottom: 125%}
.ind_photo .txt{padding: .1rem 0}
@media (max-width:768px) {
.ind_photo .list{margin: 0 -5px}
.ind_photo .item{padding:0 5px;}
}


.RighInfo002939{padding:.5rem 0;}
.RighInfo002939 .name{border-bottom: 1px dotted #e8e8e8; text-align: center; margin-bottom: .37rem; padding-bottom: .2rem;}
.RighInfo002939 .name h1{margin: 0 0 .1rem 0;font-size: .3rem;color: #333;font-weight: normal;}
.RighInfo002939 .time time{display: inline-block; vertical-align: middle;}
.RighInfo002939 .edit-info{line-height: 2;color: #333; text-align: justify; padding-bottom: .3rem;}
.RighInfo002939 .edit-info p{line-height: 2; margin-bottom: 0.1rem;}

