/* ==========================================================================



   Global



   ========================================================================== */



    



    html {



        font-size: 62.5%;



    }



    



    a {



        color: #333;



    }



    



    a:hover {



        color: #f76f01;



    }



    



    body {



        color: #333;



        font: 12px/1.7 Arial, microsoft yahei,  Helvetica, sans-serif;



        background: #f7f6f4;



    }



    



    .wrapper {



        max-width: 1020px;



        /*min-width: 980px; */



        _width: 1020px;



        padding: 0 10px;



        margin-left: auto;



        margin-right: auto;



    }



    



    .wrapper:after,



    .row:after {



        content: "";



        display: table;



        clear: both;



    }



    /* arrow */



    



    .arrow {



        position: absolute;



        top: 50%;



        margin-top: -4px;



    }



    



    .arrow * {



        position: absolute;



        top: 0;



        left: 0;



        width: 0;



        height: 0;



        border: 0 dashed transparent;



        overflow: hidden;



    }



    /* arrow-right */



    



    .arr-r * {



        border-left-style: solid;



        border-width: 4px 0 4px 4px;



    }



    



    .arr-r em {



        left: 1px;



    }



    



    .arr-r span {



        border-left-color: #3675bb;



    }



    



    .tri {



        position: absolute;



        width: 0;



        height: 0;



        border: 0 dashed transparent;



        overflow: hidden;



    }



    /* ==================================



   menu



   ================================== */



    



    .menu {



        position: relative;



    }



    /* menu-hd */



    



    .menu-hd {



        position: relative;



        z-index: 1002;



        overflow: hidden;



        height: 30px;



        line-height: 30px;



        padding: 0 20px 0 6px;



    }



    /* menu-bd */



    



    .menu-bd {



        display: none;



        position: absolute;



        z-index: 1001;



        margin-top: -1px;



    }



    



    .menu-bd-panel {



        padding: 5px 0;



        border: 1px solid #eee;



        background: #fff;



        min-width: 96px;



    }



    



    .menu-bd-panel a {



        display: block;



        padding: 0 5px;



        line-height: 28px;



        white-space: nowrap;



        color: #6C6C6C



    }



    /* menu arrow */



    



    .menu-hd .fa-caret-down {



        -webkit-transition: .3s ease-in;



        -moz-transition: .3s ease-in;



        -o-transition: .3s ease-in;



        transition: .3s ease-in;



        position: absolute;



        height: 30px;



        line-height: 30px;



        top: 0;



        right: 6px;



    }



    /* menu hover */



    



    .menu-hover .menu-hd {



        z-index: 10002;



    }



    



    .menu-hover .menu-bd {



        z-index: 10001;



    }



    



    .menu-hover .menu-hd {



        padding: 0 19px 1px 5px;



        border-width: 0 1px;



        border-style: solid;



        border-color: #eee;



        background: #fff;



    }



    



    .menu-hover .menu-hd .fa-caret-down {



        -webkit-transform: rotate(180deg);



        -moz-transform: rotate(180deg);



        -o-transform: rotate(180deg);



        transform: rotate(180deg);



    }



    



    .menu-hover .menu-bd-panel a:hover { background: #eee;  }











    /* search */







    /* ==========================================================================



   Header



   ========================================================================== */







    header {}



    



    header .wrapper { min-height: 80px; position: relative; z-index: 99;}    



     .logo { position: absolute; left:60px;width:200px;height:100px; overflow: hidden; line-height:100px; }  



    .logo img{max-width: 100%;}  

    .companytxt{position: absolute;top:0;left:270px; height: 100px;font: 700 24px/100px microsoft yahei;color: #333; }

    .lang{right:10px;position: absolute;top:38px;height: 14px; line-height: 14px;}

.lang a{margin-left: 10px;}



@media only screen and (max-width: 880px){



    .logo {left:10px;} 

    .companytxt{left:220px;font: 700 20px/100px microsoft yahei;} 



}    



@media only screen and (max-width:767px) {



   .logo{display: none;}

   .lang{top:18px;right: 48px;z-index: 999;}

   .companytxt{display: none;} 



}











    /* ==========================================================================



   Nav



   ========================================================================== */



    /* primary */



    



    .globalnav {



        position: absolute;



        z-index: 999;



        right: 0;



        top: 16px;



    }



    



    .globalnav li {



        float: left;



    }



    



    .globalnav li a {



        display: block;



        color: #444;



        padding: 0 20px;



        font-size: 14px;



        line-height: 42px;



        font-family: microsoft yahei;



    }



    



    .globalnav .nav-sep {



        width: 2px;



        height: 42px;



        background: url(../images/nav-sep.gif) no-repeat 0;



    }



    



    .globalnav .active a,



    .globalnav li .active1 {



        color: #ff0000;



    }



    



    .dropdown {



        position: absolute;



        z-index: 999;



        background: #fff;



        background: rgba(255, 255, 255, .9);



        display: none;



        padding: 15px 20px;



        border-bottom: 3px solid #fe7000;



        margin-left: -65px;



        top: 100%;



        min-width: 150px;



    }



    



    @media (min-width:768px) {



        .active1 + .dropdown {



            top: 56px;



        }



    }



    



    .dropdown:after {



        content: "";



        position: absolute;



        width: 0;



        height: 0;



        border: 0 dashed transparent;



        overflow: hidden;



        border-top-style: solid;



        border-width: 5px 5px 0;



        border-top-color: #333;



        left: 50%;



        margin-left: -5px;



        top: -5px;



    }



    .dropdown a {



        /*    white-space: nowrap;*/



        line-height: 30px;



        font-size: 14px; 



        float: left;



        padding: 0;



        color: #000;



        background: none;



        border-bottom: 0 none;



        width: 90%;



        display: block;



        text-align: left;



    }



    



    @media (max-width:767px) {



        .dropdown a {



            /*    white-space: nowrap;*/



            font-size: 16px;



            width: 100%;



            text-align: left;



        }



        .dropdown { min-width: calc(100% - 40px);}



    }



    



    .dropdown a .fa {



        font-size: 12px;



        line-height: 30px;



        color: #ccc;



        padding-right: 5px;



    }



    



    .dropdown a:hover,



    .dropdown a:hover .fa {



        color: #fe7000;



    }







    /* ==========================================================================



   Content



   ========================================================================== */







.hidden {display: none;}







/* ==========================================================================



   home_about



   ========================================================================== */



.home_products{padding:80px 0;background: linear-gradient(#f7f6f4, #f7f6f4);  }



.home_products .txtarea{width:270px;height: 350px;overflow: hidden;float: left;font: 300 14px/24px Arial;}



.home_products .txtarea h3{font: 700 36px/48px Arial;margin-bottom:20px;}



.home_products .txtarea .desc{height: 120px;overflow: hidden;margin-bottom: 20px;}



.home_products .txtarea .more a{padding:0 25px; line-height: 36px; border:2px solid #222222;display: inline-block;



    -webkit-border-radius: 4px;



    -moz-border-radius: 4px;



    -ms-border-radius: 4px;



    -o-border-radius: 4px;



    border-radius: 4px;



}



.home_products .txtarea .more a:hover{border:2px solid #f76f01;}







.hpromode{width: calc(100% - 336px); float: right;}



.hpromode .hpromenu{text-align: center;margin-bottom: 20px;}



.hpromode .hpromenu a{font-size: 14px;margin:0 5px;}



.hpromode .hpromenu a .fa{color: #f76f01;}



.hprolist{padding:0 20px;position: relative;}



.hprolist .owl-pagination{display: none;}



#owl-hpro .owl-prev,#owl-hpro .owl-next{opacity:1;top:40%; width:42px;height:42px;background: none; text-indent: 100px;overflow: hidden;padding:0;margin:0;



-webkit-border-radius:0;



    -moz-border-radius:0;



    border-radius:0;



}



#owl-hpro .owl-prev{position: absolute;left:-20px; background: url(../images/arr01.png) center no-repeat;}



#owl-hpro .owl-next{position: absolute;right:-10px;background: url(../images/arr02.png) center no-repeat;}



#owl-hpro .item{text-align: center;}



#owl-hpro .item img{width:151px; height: 282px;}







/* ==========================================================================



   home_Intro



   ========================================================================== */



.home_Intro{padding:20px 0 150px 0;background: url(../images/homebg01.jpg) center bottom no-repeat;font: 300 14px/24px Arial;}



.home_Intro .wrapper{max-width: 1400px;}



.intro_left{width: 457px;height: 400px; float: left;}



#owl-hpic03{padding:0 20px 0 80px;}



#owl-hpic03 .owl-prev,#owl-hpic03 .owl-next{opacity:1;top:40%; width:38px;height:87px;background: none; text-indent: 100px;overflow: hidden;margin:0;



-webkit-border-radius:0;



    -moz-border-radius:0;



    border-radius:0;



}



#owl-hpic03 .owl-prev{position: absolute;left:0; background: url(../images/introleft.png) center no-repeat;}



#owl-hpic03 .owl-next{position: absolute;right:0;background: url(../images/introrig.png) center no-repeat;}



#owl-hpic03 p{text-align: center;font: 300 24px/30px Arial;color: #1c1c1a;margin-top: 10px;text-transform:Uppercase;}











.intro_rig{width: calc(100% - 800px); float: right;margin-right: 150px;}



.hintro_tit{font: 700 36px/48px Arial;}



.intro_rig .desc{font: 300 14px/24px Arial;/*height: 72px;*/ overflow: hidden;margin-bottom:30px;margin-right: 20px;}



.intro_rig .intro_box{border-right: 2px solid #ff6c00;padding-right: 20px;}



.intro_rig .intro_box .mode{height: 70px;overflow: hidden;margin-bottom: 20px;}



.intro_rig .intro_box .pic{width:54px; height: 60px; line-height: 60px; float: left;}



.intro_rig .intro_box .textare{width: calc(100% - 80px); float: right;}



.intro_rig .intro_box .textare h3{color: #f76f01;font: 700 14px/70px Arial;}



.intro_rig .more{margin-bottom:40px;height: 36px;text-align: right;}



.intro_rig .more a{padding:0 25px; line-height: 36px; border:2px solid #222222;display: inline-block;



    -webkit-border-radius: 4px;



    -moz-border-radius: 4px;



    -ms-border-radius: 4px;



    -o-border-radius: 4px;



    border-radius: 4px;



}



.intro_rig .more a:hover{border:2px solid #f76f01;}



@media only screen and (max-width:1240px) {



    .intro_rig{width: calc(100% - 550px); float: right;margin-right:0px;}



}



@media only screen and (max-width:920px) {



    .home_products .txtarea{width:100%;height: auto;float: none; text-align: center;margin-bottom:20px;}



    .home_products .txtarea .desc{height:48px;}



    .hpromode{width:100%; float: none;}



    .intro_left{width:100%;height: 400px; float: none;overflow: hidden;}



    .intro_rig{width:100%; float: none;}



    #owl-hpic03{width: calc(100% - 100px);}



}



@media only screen and (max-width:540px) {



    .home_Intro{padding:20px 0 80px 0;font: 300 14px/24px Arial;background: url(../images/homebg02.jpg) center bottom no-repeat;}



    .intro_rig{width:100%; float: none;}



    .intro_rig .more{text-align: center;}



}



/* ==========================================================================



   Footer



   ========================================================================== */



footer { color:#555555; font-size: 12px; background: #f7f6f4;padding:30px 0;font: 300 14px/24px Arial;}



footer a { color: #555555; }



footer a:hover { text-decoration: underline; }



.footmenu{text-align: center;}



.footmenu a{padding-left: 20px;background: url(../images/arr03.png) left center no-repeat;margin: 0 10px;color: #333;}



.footbd{text-align: center;font-weight: bold;margin-top:5px;}



.footbd span{margin:0 10px;}







.fixed-b { position: fixed; width: 100%; background: #333; bottom: 0; left: 0; display: none;z-index: 3; }



.fixed-b li { width: 25%; text-align: center; color: #fff; float: left; }



.fixed-b li a { display: block; border-right: 1px solid #454545; color: #fff; padding: 10px 0; }



.fixed-b li .fa{font-size: 24px; line-height: 30px;}



.fixed-b li:last-of-type a { border-right: 0 none; }



.fixed-b li a .txt { display: block; margin-top: 5px; }











@media only screen and (max-width: 767px) {



footer{padding:20px 0 50px 0;}



.fixed-b { display: block; }







}



.toggle-btn { display: none;}











@media only screen and (max-width: 767px) {



    .toggle-btn {



        display: block;



        position: absolute;



        right: 20px;



        top: 10px;



        transition: all 0.5s;



    }    



    .inner-cont > p img {



        width: 100%;



        height: auto;



    }    



.gn-item:hover .toggle-btn {



        -webkit-transform: rotate(45deg);



        -ms-transform: rotate(45deg);



        transform: rotate(45deg);



    }



}