@import "base.css";
html {
    -webkit-text-size-adjust: 100%;
}
html{font-size:14px}


@media screen and (min-width:1200px){}
@media screen and (min-width:640px) and (max-width:1199px) {}
@media screen and (max-width:639px){html{font-size:12px}}

body{color: #333333;background: #ffffff;line-height: 1.5;overflow-x: hidden}
a{color: #333333;}
.container{width:94%;margin: auto;max-width: 1200px;}
.main{width:70.5%;margin: auto}


/*top*/
#top{padding: 5px 0}
#top .logo{width: 25%;max-width:100px;}
#top .tel{color: #e84021;font-size: 22px;line-height: 1.2;padding-left: 50px;background-size: 45px;background-position: left center;background-image: url("../images/tel.png");background-repeat: no-repeat;}
#top .tel span{font-size: 16px;color: #000033}
#top .search_box{width: 80%;margin:20px auto 0;max-width: 360px;}
#top .search_box .search{max-width: 360px;border: 1px solid #e84021;line-height: 32px;margin-bottom: 5px;}
#top .search_box .search_input{padding: 0 5px;width: calc(100% - 80px);}
#top .search_box .search_but{width:50px;text-align: center;font-size: 12px;padding: 0 10px;background: #e84021;color: #FFFFFF;display: inline-block;float: right}
#top .search_box .search_but:hover {color: #fff;font-weight: 400;font-style: normal;text-decoration: none;
    /* background */background-color: rgb(153, 0, 0);background-image: none;background-repeat: no-repeat;background-position: 50% 50%;background: -webkit-linear-gradient(none, none);background: -moz-linear-gradient(none, none);background: -ms-linear-gradient(none, none);background: linear-gradient(none, none);}
#top .search_box .words{color: #656D78;font-size: 12px;}

/*nav*/

#nav{background: #e84021;text-align: center}
#nav  .nav_li {float: left;width:16%;line-height: 52px; position: relative}

#nav .nav_li  .nav_t {padding: 0;margin: 0;position: relative;height: 100%;line-height: inherit;}
#nav .nav_li  .nav_t a{color: #ffffff;font-size: 16px;font-weight: normal;font-style: normal;text-decoration: none;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}


#nav .nav_li  .nav_menu {overflow: hidden;position: absolute;width: 100%;top: 100%;left: 0;background: #a30000;z-index: 99}
#nav .nav_li  .nav_menu>li {}
#nav .nav_li  .nav_menu>li a{padding: 0 15px;height: 70px;line-height: 70px;outline: none;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: #ffffff;font-size: 15px;}

#nav  .nav_li:hover {background: rgb(255, 255, 255);}
#nav .nav_li  .nav_t.current {background:#FFFFFF;}
#nav .nav_li  .nav_t.current a, #nav  .nav_li:hover a{color: #e84021;font-weight: bold;font-style: normal;text-decoration: none;}
#nav .nav_li  .nav_menu>li:hover ,#nav .nav_li  .nav_menu>li.current{background:#e84021;}
#nav .nav_li  .nav_menu>li:hover a:hover {color: #ffffff;font-weight: bold;font-style: normal;text-decoration: none;}/* current */
#nav .nav_li  .nav_menu>li.current a {color: #ffffff;font-weight: bold;font-style: normal;text-decoration: none;}

.menu-button{position:fixed;width: 24px;top: 10px;right:10px;z-index: 999;padding: 9px 10px;margin-right: 15px;margin-top: 8px;margin-bottom: 8px;border: 1px solid #ddd;border-radius: 4px;cursor: pointer;display: none;background: #ffffff;}
.menu-button:hover{background: #ddd}
.menu-button span{width:100%;display: block;height: 2px;background:#888;border-radius: 1px;-webkit-transition: .3s;transition: .3s;position: relative}
.menu-button span:nth-child(2){margin: 4px 0}

.menu-button.cross span:nth-of-type(1) {-webkit-transform: translateY(6px) rotate(-45deg);-ms-transform: translateY(6px) rotate(-45deg);transform: translateY(6px) rotate(-45deg);}
.menu-button.cross span:nth-of-type(2) {opacity: 0;}
.menu-button.cross span:nth-of-type(3) {-webkit-transform: translateY(-6px) rotate(45deg);-ms-transform: translateY(-6px) rotate(45deg);transform: translateY(-6px) rotate(45deg);}



#footer{background: rgb(32, 35, 42);padding:30px 0;color: #FFFFFF;line-height: 2;font-size: 14px;}
#footer ul li{float: left;width: 25%;}
#footer ul li  a,.footer_b a{color: #fff}
#footer ul li .tit,#footer ul li .tit a{color: #cccccc;font-size: 17px;}
.footer_b{background: #000;color: #FFFFFF;line-height: 2;padding: 10px 0;font-size: 12px;}

/*top*/
@media screen and (max-width:1024px){
    #top .logo{max-width:150px;}
    #top .tel{font-size: 20px;padding-left: 34px;background-size: 30px;}

    #top .search_box{max-width: 320px;}
    #footer{font-size: 12px;}
}

@media screen and (max-width:812px){
    .search_box{display: none}
    #nav .nav_li .nav_t a{font-size: 15px;}

}

@media screen and (max-width:600px){
    .menu-button{display: block}
    #top .tel{display: none}

    #nav {text-align: left;width: 100%;height: 100%;position: fixed;top: 0;left: 0;z-index: 9;background: #fff;display: none}
    #nav.open{display: block}
    #nav ul li{border-bottom: 1px solid #eee}
    #nav ul li:nth-child(1){margin-top: 50px;}
    #nav .nav_li{width: 100%;float: none}
    #nav .nav_li .nav_menu{display: none !important}
    #nav .nav_li .nav_t a{font-size: 16px;line-height: 3;color: #333333;}
    #nav .nav_li .nav_t.current a, #nav .nav_li:hover a {color: #059fe9}

    #footer ul li{width: auto;float: none}
    #footer ul li:nth-child(1),#footer ul li:nth-child(2),#footer ul li:nth-child(3){display: none}

}




.banner img {display: block;width: 100%;height: 100%;object-fit: cover;}
.banner .swiper-pagination .swiper-pagination-bullet{width: 15px;height: 15px;border-radius: 0}
.banner .swiper-pagination .swiper-pagination-bullet-active{background: #FFFFFF}
.banner_b{padding-bottom: 10px;background: url("../images/banner_b.png") repeat-x ;}

.container_l {width: 260px;float: left;}
.container_l .tit{font-size: 23px;background: url("../images/banner_b.png") no-repeat left bottom;color: #FFFFFF;line-height: 3}
.container_l ul{margin-bottom: 15px;min-height: 110px}

.left_contact{padding: 5px;background: rgb(243, 243, 243);font-size: 16px;line-height: 2}
.left_contact h3{color: #e84021;font-size: 24px;}

.in_pro_l{background-color: rgb(232, 64, 33);}
.in_pro_l ul{background: #FFFFFF;margin: 10px;}
.in_pro_l ul li{text-align: center;border-bottom: 1px solid #dddddd;padding: 10px;line-height: 2;font-size: 14px;}
.in_pro_l ul li:hover a{color: #cc0000}
.in_pro_l ul li a{display: block}



.in_pro_r {width: calc(100% - 265px);float: right;padding:10px 0 10px 5px;font-size: 14px}
.in_pro_r ul li{width:33.3%;float: left;}
.in_pro_r ul li .box{margin:16px 0 16px 16px;border: 1px #f5f5f5 solid;}
.in_pro_r ul li .tit {margin: 5px;line-height:2;color: #404040;transition: color 200ms linear;color: #404040}
.in_pro_r ul li .tit:hover {color: #E43939;font-weight: normal;font-style: normal;text-decoration: underline;}
.in_pro_r ul li:hover .box ,.in_case ul li:hover .box{border-color: #e84021}



.tran_box{-webkit-transition: all 200ms linear;-moz-transition: all 200ms linear;-o-transition: all 200ms linear;-ms-transition: all 200ms linear;transition: all 200ms linear;}
.tran_box .img{overflow: hidden;}

.title{color: #e84021;font-size: 40px;line-height: 3;}


/*in case*/
.in_case{padding: 40px 0 70px;margin-top:40px;background: url("../images/bg_incase.jpg")  center top;}
.in_case .in_case_box{padding: 0 30px;}
.in_case ul li{background: #FFFFFF}
.in_case ul li .box{border: 1px #f5f5f5 solid;}

.in_case ul li .box .tit {margin: 5px 5px 15px;line-height:2.2;font-size: 16px;color: #404040;transition: color 200ms linear;}
.in_case ul li .box .tit:hover {    color: #e84021;    font-weight: normal;    font-style: normal;    text-decoration: none;}
.in_case .iconfont{font-size:22px;color: #7E7E7E;display: inline-block; cursor: pointer;}
.in_case .btn_prev{left:0;top: 50%;}
.in_case .btn_next{right:0;top: 50%;}



/*in */

.in_text_box .title{padding: 10px 0}
.in_text_box ul li {margin-bottom: 40px;background: rgb(246, 247, 249)}
.in_text_box ul li .img{width: 40%;}
.in_text_box ul li .text{width:54%;margin: 30px 2%;line-height: 2}
.in_text_box ul li .text .num{font-size: 84px;top: 0;right: 0;color: #bbbbbb;line-height: 1}
.in_text_box ul li .text .tit{font-size: 28px;color: #bc0008;font-weight: bold}
.in_text_box ul li .text .tit2{font-size:20px;}
.in_text_box ul li .text .text_box{padding-right: 100px;}

.in_text_box ul li:nth-child(odd) .img{;float: left}
.in_text_box ul li:nth-child(odd) .text{float: right;}

.in_text_box ul li:nth-child(even) .img{float: right}
.in_text_box ul li:nth-child(even) .text{float: left;}




@media screen and (max-width:1024px){
    .container_l {width: 210px;}
    .container_l .tit{font-size:20px;}
    .in_pro_l ul li{padding:5px 8px;font-size: 12px;}
    .in_pro_r {width: calc(100% - 215px);padding:0;font-size: 13px}


    .title{font-size:30px}


    /*in case*/
    .in_case{padding:20px 0 40px;margin-top:20px;}
    .in_case ul li .box .tit {margin: 5px;font-size: 15px;}

    /*in */

    .in_text_box .title{padding:0}
    .in_text_box ul li {margin-bottom: 20px;}
    .in_text_box ul li .text{width:55%;margin:10px 2%;}
    .in_text_box ul li .text .num{font-size: 60px;}
    .in_text_box ul li .text .tit{font-size: 24px;}
    .in_text_box ul li .text .text_box{padding-right: 70px;}


}



@media screen and (max-width:812px){
    .container_l {width:150px;}
    .container_l .tit{font-size:18px;}



    .left_contact{padding:3px;font-size: 14px;}
    .left_contact h3{font-size:20px;}

    .title{font-size:26px}

    .in_pro_r ul li{width: 50%;}
    .in_pro_r ul li:nth-child(n+5){display: none}
    .in_pro_r ul li .box{margin: 5px 5px 5px;}
    .in_pro_r ul li .tit{font-size: 12px;}
}

@media screen and (max-width:640px){
    .in_pro_l,.in_text_box ul li .text .num,.in_about .in_about_r{display: none}
    .in_pro_r{width: 100%;padding-top: 15px;}
    .title{font-size:20px}

    .in_text_box ul li .text .tit{font-size: 18px;}
    .in_text_box ul li .img,.in_text_box ul li .text,.in_about .in_about_l{width: auto!important;float: none !important}
    .in_text_box ul li .text .text_box{padding: 0}



}






/*.in_text_box ul li:nth-child(1) {background: #C5C6C7}*/



/*.in_about a.more {display: inline-block;width: 100%;height: 100%;font-size: 15px;color: #e84021;font-weight: 400;text-decoration: none;font-style: normal;transition: color .3s;}*/

.in_about{padding: 40px 0;background: url("../images/bg_about.png") no-repeat center top; color: #FFFFFF;}
.in_about .in_about_r{float: right;width: 40%;margin-top: 20px}
.in_about .in_about_l{float: left;width:55%;}
.in_about .in_about_l .text{font-size: 16px;line-height: 3;}


.btn_more {width:180px;margin-top: 10px;line-height: 2.5;font-size: 15px;color: #e84021;display: inline-block;background: #FFFFFF;border: 2px solid #e84021;text-align: center;text-decoration: none;cursor: pointer;vertical-align: middle;transition: all 300ms ease-in-out;}
.btn_more:hover {color: #FFFFFF;border-color: #e84021;background-color: rgb(232, 64, 33);background-image: none;background-repeat: no-repeat;background-position: 50% 50%;}
.btn_more.hover-effect[data-effect-name="sweep-to-right"]:hover {background-color: rgb(255, 255, 255);background-image: none;background-repeat: no-repeat;background-position: 50% 50%;background-size: auto;}
.btn_more.hover-effect:hover::before {background-color: rgb(232, 64, 33);background-image: none;background-repeat: no-repeat;background-position: 50% 50%;}



.in_news{padding-bottom: 50px;}
.in_news ul li{width: 32%;float: left;margin: 20px 0;line-height: 2}
.in_news ul li:nth-child(2){margin-left: 2%;margin-right:2%;}
.in_news ul li .tit{ padding-top: 5px;display: -webkit-box;font-size: 17px;color: #404040;text-align: left;font-weight: bold;font-style: normal;text-decoration: none;transition: color 200ms linear;}
.in_news ul li .tit:hover {color: #222;font-weight: normal;font-style: normal;text-decoration: underline;}



.container_l ul li{padding-left: 10px;border: 1px  solid #dddddd;color: #444444;cursor: pointer;background-color: rgb(243, 243, 243);line-height: 3;}

.container_l ul li a {display: block;}
.container_l ul li.current,.container_l ul li:hover{background: rgb(232, 64, 33);}
.container_l ul li.current a, .container_l ul li:hover a{color: #FFFFFF}


.container_r{width: calc(100% - 280px);float: right;padding:20px 0;}
.container_r .page_tit{line-height: 40px;border-left: 3px solid #e84021;padding-left: 10px;color: #666;font-size: 12px;}
.container_r .page_tit h3{font-size: 24px;color: #000}
.container_r .page_tit span{float: right}
.container_r .page_tit span a{color: #999;}

.container_r .page_content{border-top: 1px solid #7E7E7E;padding:10px 0;line-height: 1.8;margin-top: 20px;}

.container_r .pro_list  li{width: 32%;float: left;margin-top: 15px;line-height: 3}
.container_r .pro_list  li:nth-child(3n-1){margin-left:2%;margin-right:2%}
.container_r .pro_list  li .box{border: 1px solid #f5f5f5;}
.container_r .pro_list  li:hover .box{border: 1px solid #e84021;}

.container_r .page{padding:30px ;}
.container_r .page ul li{display: inline-block;margin: 0 5px;border: 1px solid #cccc;padding: 0 5px;font-size: 12px;cursor: pointer;}
.container_r .page ul li.active,.container_r .page ul li:hover{background: #e84021;}
.container_r .page ul li.active a,.container_r .page ul li:hover a{color: #FFFFFF}


.pro_img{width:40%;float: left}
.pro_img img{box-shadow:4px 4px 10px 0 #616161;}

.pro_desc{width: 55%;float: right;line-height: 2}
.pro_desc .tit{font-size: 24px;}

.pro_info{min-height: 260px;}
.pro_info .info_tit{font-size: 24px;color: #404040;line-height: 2.5}
.pro_info .tit{border-bottom: 1px solid #CCCCCC;line-height: 2.6;margin-top:50px;margin-bottom: 30px}
.pro_info .tit span{padding: 0 20px;background: #e84021;color: #FFFFFF;display: inline-block}
.show_next{margin: 20px 0;}
.show_next a:hover{color: #e84021}


.news_list{}
.news_list li{margin-bottom: 15px;border-bottom: 1px solid #ddd;padding-bottom: 15px;}
.news_list li .img{width: 250px;float: left;height: 160px;overflow: hidden;}
.news_list li .img img{top: calc( 50% - 125px);left: calc( 50% - 125px);position: absolute;}

.news_list li .text{width:calc(100% - 265px);float: right;color: #666666;font-size: 14px;}
.news_list li .text .tit{color: #404040;font-size: 16px;}
.news_list li .text .num {color: #a5a5a5;}
.news_list li .text .num span{float: right}
.news_list li .text .num i{font-size: 14px;color: #a5a5a5;margin-right: 3px;}



@media screen and (max-width:1024px){
    .in_about .in_about_l .text{font-size:14px;}
    .btn_more {width:160px;font-size: 14px;}

}

@media screen and (max-width:812px){


    .container_r{width: calc(100% - 165px)}
    .container_r .page_tit{line-height: 2;border-left: 2px solid #e84021;padding-left: 10px;color: #666;font-size: 12px;}
    .container_r .page_tit h3{font-size:16px}
    .container_r .page_tit span{display: none}
    .container_r .page_content{margin-top: 10px;}



    .in_news ul li{width:100%;float:none;margin: 10px 0 !important;border-bottom: 1px dashed #999;}
    .in_news ul li .img,.in_news ul li  p.font_ell{display: none;}


    .in_news ul li .tit{ padding-top: 5px;display: -webkit-box;font-size: 17px;color: #404040;text-align: left;font-weight: bold;font-style: normal;text-decoration: none;transition: color 200ms linear;}
    .in_news ul li .tit:hover {color: #222;font-weight: normal;font-style: normal;text-decoration: underline;}


}
@media screen and (max-width:600px){
    .no_screen {display: none}

    .container_r{width:auto;float: none}

    .container_l {width:100%;float: none;}
    .container_l .tit{font-size:16px;}
    .container_l ul{background: rgb(243, 243, 243);text-align: center;min-height: auto;padding: 10px 0}
    .container_l ul li{width: auto;display: inline-block;float: left;border: none;border-bottom:1px  solid #dddddd;padding:0 8px;margin: 0 8px;}
    .container_r .pro_list li{width: 46%;margin: 10px 2%;}

    .pro_img{width: 80%;float: none;margin: auto}
    .pro_desc{width: auto;margin-top: 10px;float: none;}
    .pro_desc .tit,.pro_info .info_tit{font-size: 16px;text-align: center}
    .pro_info .tit{margin-top: 15px;}


    .news_list li{margin-bottom: 15px;padding-bottom: 15px;}
    .news_list li .img{width:140px;float: left;height:120px;}
    .news_list li .img img{top: calc( 50% - 70px);left: calc( 50% - 70px);}

    .news_list li .text{width:calc(100% - 155px);font-size: 12px;}
    .news_list li .text .tit{color: #404040;font-size: 14px;}
    .news_list li .text .num i{font-size: 12px;color: #a5a5a5;margin-right: 3px;}

}



.navBtn{display: none}
.navBtn{position: fixed;top: 20px;right: 20px;background: #efefef;z-index:999;width: 33px;padding: 5px 0 5px;}
.navBtn span{width: 80%;height: 2px;background: #9c9c9c;display: block;margin: 4px auto;}
.nav.current{display: block;}


