@media (max-width: 1600px) {
    .header-lt .logo {
        width: 180px;
    }

    .header-ul > li {
        min-width: 128px;
    }

    .idx-newslt {
        width: 590px;
    }

    .idx-newsrt {
        width: 574px;
    }

    .idx-newsrtul > li .li_lt .d2 {
        font-size: 20px;
    }

    .idx-newsrtul > li .li_rt {
        width: 465px;
    }

    .idx-newsrtul > li .li_box {
        padding: 18px 0;
    }

    .idx-caseul > li {
        width: 590px;
    }

    .idx-casecontent .caseIco {
        width: 170px;
        height: 170px;
    }

    .idx-casecontent .caseIco .n1 {
        width: 130px;
        height: 130px;
        line-height: 130px;
        font-size: 30px;
    }

    .footer1-content .footul1 {
        padding-left: 44px;
    }

    .about1bt .about1btcontent .des {
        width: 100%;
    }

    .about2-ul > li {
        width: 285px;
    }

    .about4-cont .about4-lt {
        width: 770px;
    }

    .ab4img2-ul > li {
        width: 375px;
    }

    .about4-rt {
        width: 412px;
    }

    .about5-ul > li {
        width: 287px;
    }

    .techy-rt {
        width: 940px;
    }

    .techyrt-ul > li .li_rt {
        width: 550px;
    }

    .techyrt-ul > li .imgbox {
        width: 280px;
    }

    .pro-ul > li {
        width: 285px;
    }

    .prodes2list .mok .li {
        margin-right: 20px;
        width: 285px;
    }

    .prodes1rt {
        width: 660px;
    }

    .prodes3-ul > li {
        width: 386px;
        margin-right: 20px;
    }

    .contact2-ul > li {
        width: 382px;
    }

    .social-ul > li .li_box .imgbox {
        width: 500px;
    }

    .social-ul > li .li_box .rt_box {
        width: 651px;
    }

    .social-ul > li .li_box {
        padding: 20px 0;
    }

    .newsdeslt {
        width: 870px;
    }

    .news-ul > li {
        float: left;
        width: 386px;
        margin-right: 20px;
    }
}

@media (max-width: 1200px) {
    .header-rt {
        display: none;
    }

    .header {
        position: fixed;
        left: 0;
        top: 0;
        z-index: 999;
        width: 100%;
    }

    .header-tp {
        background: #fff !important;
        position: absolute;
        top: 0;
        left: 0;
        top: 0;
        z-index: 999;
        width: 100%;
    }

    .header-ul {
        width: 100%;
        background-color: rgba(0, 0, 0, .7);
        position: absolute;
        top: 108px;
        left: 0;
        right: 0;
        height: auto;
        z-index: 999;
        display: none;
    }

    .header-ul > li .xiabox ul {
        background-color: rgba(0, 0, 0, .9);
    }

    .header-ul > li {
        width: 100%;
        line-height: normal;
    }

    .header-ul li:nth-child(7n) {
        display: none;
    }

    .header-ul li:nth-child(8n) {
        display: none;
    }

    .header-ul > li a {
        width: 100px;
        padding: 15px 0;
    }

    .header-ul > li:hover > a {
        background-color: transparent;
    }

    .header-ul > li .xiabox {
        position: static;
    }

    .header-ul > li .xiabox ul {
        padding: 0;
    }

    .header-ul > li .xiabox ul li {
        padding: 15px 0;
    }

    .header-ul > li .xiabox {
        padding-top: 0;
    }

    .header-ul > li.line:after {
        display: none;
    }

    .header-ul > li.active {
        background-color: rgba(240, 142, 33, .75);
    }

    .header-ul > li.active > a {
        background-color: transparent;
    }

    .header-ul > li.hover a {
        background-color: rgba(240, 142, 33, .75);
    }

    .menu {
        display: block;
    }

    .margintp {
        margin-top: 108px;
    }

    .header-ul > li {
        position: relative;
    }

    .header-ul > li .txt a {
        padding-bottom: 18px;
    }

    .header-ul > li .add {
        display: block;
        position: absolute;
        top: 18px;
        right: 10px;
    }

    /* 首页产品中心开始 */
    .idx-procontent {
        border: none;
    }

    .idx-proul > li.line .li_box::after {
        display: none;
    }

    .idx-proul > li .li_box .infos .des {
        display: none;
    }

    .idx-proul > li .li_box:hover .look {
        display: none;
    }

    .idx-proul > li {
        height: auto;
    }

    .idx-proul > li .li_box {
        padding-top: 0;
    }

    .idx-proul > li .li_box:hover {
        position: static;
        transform: translate(0);
        -moz-transform: translate(0);
        -ms-transform: translate(0);
    }

    .idx-proul {
        justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
    }

    .idx-proul li {
        width: 32%;
    }

    .idx-proul > li {

        width: 20%;
        height: 200px;
        position: relative;

    }

    .idx-proul > li .li_box .li_tp {
        padding-left: 0;
        padding-right: 0;
        margin-top: 5%;
    }

    .idx-proul > li .li_box .img {
        box-shadow: none;
    }

    .idx-proul > li .li_box {
        border: 1px solid #dddddd;
    }

    .idx-proul > li .li_box .infos .t1 {
        font-weight: bold;
        font-size: 20px;
        color: #f08e21;
    }

    .idx-proul > li .li_box .img {
        height: auto;
    }

    .idx-proul > li .li_box:hover .infos .t1 {
        font-size: 20px;
    }

    .idx-proul > li .li_box:hover {
        border: 1px solid #f08e21;
    }

    .idx-proul > li .li_box .infos {
        padding-bottom: 10%;
        margin-top: 10%;
    }

    .idx-ab1-ul {
        flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }

    .idx-ab1-ul > li {
        width: 100%;
    }

    .idx-ab1-ul > li.li_lt .li_box .look {
        margin-top: 20px;
    }

    .idx-ab2ul > li {
        width: 100%;
    }

    .idx-ab2ul > li .li_box {
        height: auto;
    }

    .idx-ab2ul > li .li_box .img {
        width: 65%;
    }

    .idx-ab2ul > li .li_box .infos {
        width: 35%;
    }

    .idx-ab2ul > li .li_box .infos .center .t2 {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }

    .idx-ab2ul > li.lidan .li_box {
        flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
    }

    .idx-ab2ul > li.liou .li_box {
        flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
    }

    .idx-ab2ul > li.liou .li_box .infos .san {
        right: -15px;
        left: auto;
        background: url(../image/san2.png) no-repeat !important
    }

    .idx-ab2ul > li.lidan .li_box .infos .san {
        left: -15px;
        right: auto;
        background: url(../image/san1.png) no-repeat !important
    }

    .idx-ab1-ul > li.li_lt .li_box {
        height: auto;
        padding-bottom: 116px;
    }

    .idx-newscontent {
        flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }

    .idx-newslt,
    .idx-newsrt {
        width: 100%;
    }

    .idx-newsrt {
        margin-top: 26px;
    }

    .idx-newsrtul > li .li_lt {
        width: 20%;
        margin-right: 0;
        padding-right: 15px;
    }

    .idx-newsrtul > li .li_rt {
        width: 100%;
    }

    .idx-caseul > li {
        width: 100%;
    }

    .idx-casecontent .caseIco {
        display: none;
    }

    .idx-caseul > li .li_box .infos {
        width: 30%;
    }

    .idx-caseul > li .li_box .imgbox {
        width: 70%;
    }

    .idx-caseul > li:nth-child(2n) .li_box {
        flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
    }

    .idx-caseul > li:nth-child(2n) .li_box .san {
        right: -30px;
        left: auto;
        border-left: 15px solid #fff;
        border-top: 17px solid transparent;
        border-right: 17px solid transparent;
        border-bottom: 17px solid transparent;
    }

    .idx-caseul > li:nth-child(2n) .li_box:hover .san {
        border-left: 15px solid #f08e21;
        border-top: 17px solid transparent;
        border-right: 17px solid transparent;
        border-bottom: 17px solid transparent;
    }

    .idx-caseul > li {
        padding: 0;
        border-bottom: 1px solid #bebebe;
    }

    .idx-partner {
        display: none;
    }

    .mob-idxpartner {
        display: block;
    }

    .footer1 {
        display: none;
    }

    .flogo {
        display: none;
    }

    .about1bt .imgbox {
        display: none;
    }

    .about1bt {
        margin-top: 20px;
    }

    .about1bt .about1btcontent .des {
        width: 100%;
    }

    .about2-ul > li {
        width: 48%;
        float: left;
        margin-right: 0;
        margin-bottom: 100px;
    }

    .about2-ul > li:nth-child(2n) {
        float: right;
    }

    .about3 .container {
        width: 100%;
    }

    .about4-cont .about4-lt {
        width: 100%;
    }

    .ab4img2-ul > li {
        width: 49%;
    }

    .about4-rt {
        width: 100%;
        margin-top: 20px;
    }

    .about5-ul > li {
        width: 49%;
        margin-right: 0;
    }

    .about5-ul > li:nth-child(2n) {
        float: right;
    }

    .aboutyc3-ul .litp {
        position: relative;
    }

    .aboutyc3-ul li .xia {
        position: absolute;
        top: 0;
        right: 0;
    }

    .aboutyc3-ul .litp-lt .imgrt .pp-bt span {
        margin-bottom: 5px;
        margin-right: 20px;
    }

    .aboutyc3-ul .litp-lt .imgrt .pp-bt i {
        display: none;
    }

    .techy-lt {
        width: 100%;
    }

    .techy-lt .tit {
        display: none;
    }

    .techy-lt .techy-ul {
        overflow: hidden;
    }

    .techy-lt .techy-ul > li {
        width: 33.33%;
        float: left;
        border: none
    }

    .techy-lt .techy-ul > li a .iconfont {
        float: none;
    }

    .techy .container {
        width: 100%;
    }

    .techy {
        padding-top: 0;
    }

    .techy-lt .techy-ul {
        width: 94%;
        margin: 0 auto;
    }

    .techy-lt .techy-ul > li a {
        padding: 20px 0;
        text-align: center;
    }

    .techycontent .tit1 {
        display: none;
    }

    .techyrt-ul > li {
        padding: 25px 0;
    }

    .techyrt-ul > li .li_lt {
        width: 100%;
        position: relative;
    }

    .techyrt-ul > li .times {
        position: absolute;
        left: 0;
        top: 0;
        z-index: 10;
        margin: 0;
    }

    .techyrt-ul > li .li_rt {
        width: 100%;
    }

    .techyrt-ul > li .imgbox {
        width: 100%;
    }

    .techyrt-ul > li .li_rt .tt2 {
        display: none;
    }

    .techy-rt {
        width: 100%;
        padding: 0 3%;
    }

    .pro-ul > li {
        width: 49%;
        margin-right: 0;
        margin-bottom: 24px;
    }

    .pro-ul > li:nth-child(2n) {
        float: right;
    }

    .pro-ul > li .li_box .infos {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .pro-ul > li .li_box .infos .t2 p {
        line-height: 22px;
    }

    .pro-ul > li .li_box .infos .t3 {
        margin-top: 10px;
        padding-top: 10px;
    }

    .prodes1lt {
        width: 100%;
    }

    #bigImg img {
        width: 100%;
    }

    .prodes1rt {
        width: 100%;
    }

    .mobmok {
        display: block;
    }

    .mobmok .mok2 {
        width: 100%;
    }

    .mobmok .mok2 .li {
        width: 100%;
        margin-right: 0;
    }

    .mobmok .mok2 .li table {
        width: 100%;
    }

    .prodes2list {
        margin-bottom: 10px;
    }

    .prodes2list .title {
        margin-top: 10px;
        margin-bottom: 20px;
    }

    .prodes3-ul > li {
        width: 49%;
        margin-right: 0;
    }

    .prodes3-ul > li:nth-child(2n) {
        float: right;
    }

    .contact2-ul > li {
        width: 100%;
        margin-right: 0;
    }

    .contact-ul {
        flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }

    .contact-ul > li {
        width: 45%;
    }

    .contact-ul {
        width: 92%;
    }

    .contact2-ul > li .infos {
        /* position: relative; */
    }

    .contact2-ul > li .dd {
        position: absolute;
        width: 73px;
        left: 0;
        top: 0;
    }

    .contact2-ul > li .dt {
        width: 100%;
    }

    .contact2-ul > li .lili {
        width: 100%;
        padding-left: 75px;
        position: relative;
    }

    .social-ul > li .li_box {
        box-shadow: 0 0 6px 2px rgba(0, 0, 0, .1);
    }

    .social-ul > li .li_rt {
        box-shadow: none;
        padding-right: 20px;
        width: 55%;
        padding-top: 0;
        padding-bottom: 0;
    }

    .social-ul > li .li_lt {
        width: 50%;
    }

    .social-ul > li .li_box .imgbox {
        width: 100%;
    }

    .social-ul > li {
        margin-bottom: 20px;
    }

    .social-ul > li:nth-child(2n) .li_rt {
        padding-left: 20px;
        padding-right: 0;
    }

    .social-ul > li .li_box .rt_box {
        width: 100%;
    }

    .newsdeslt {
        width: 100%;
    }

    .newsdesrt {
        width: 100%;
        margin-top: 40px;
    }

    .newsdesrt-ul > li .img {
        width: 30%;
    }

    .newsdesrt-ul > li .infos {
        width: 70%;
    }

    .news-ul > li .li_box .bt-lt img {
        display: none;
    }

    .news-ul > li {
        width: 49%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .news-ul > li:nth-child(2n) {
        float: right;
    }

    .idx-proul > li.li2 {
        border: none;
    }
}

@media (max-width: 991px) {
    .footer2-tp .footer2center {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }

    .er.fr {
        float: none;
        margin: 0 auto;
        text-align: center;
    }

    .erbg {
        margin: 0 auto;
    }

    .friendlink,
    .friendlink-ul {
        flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
    }

    .footer2-tp {
        width: 94%;
    }
}

@media (max-width: 768px) {
    .header-lt .logo {
        width: 170px;
        margin-left: 30px;
    }

    .header-lt .logort .p1 {
        font-size: 12px;
    }

    .header-lt .logort .p2 strong {
        font-size: 14px;
    }

    .header-lt .logort {
        height: 38px;
    }

    .header-tp {
        height: 70px;
        padding-top: 18px;
    }

    .header-ul {
        top: 70px;
    }

    .margintp {
        margin-top: 70px;
    }

    .menu {
        width: 42px;
    }

    .idx-proul > li .li_box .infos .t1 {
        font-size: 16px;
    }

    .idx-proul > li .li_box:hover .infos .t1 {
        font-size: 16px;
    }

    .idx-ab2ul > li .li_box .infos .center {
        padding-left: 20px;
        padding-right: 20px;
    }

    .idx-ab2ul > li .li_box .infos .center .t1 {
        font-size: 14px;
        margin-bottom: 5px;
    }

    .idx-ab2ul > li .li_box .infos .center .t2 {
        line-height: 19px;
        font-size: 12px;
    }

    .play_btn {
        width: 60px;
        height: 60px;
        background-size: cover;
    }

    .idx-ab1-ul > li.li_lt .li_box {
        padding-left: 30px;
        padding-right: 30px;
    }

    .idx-ab1-ul > li.li_lt .li_box .tit {
        font-size: 20px;
    }

    .idx-ab2ul > li .li_box .infos .center .t1 {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .idx-ab1 .idx-tit h3 {
        font-size: 28px;
    }

    .idx-ab2 .tit2 {
        font-size: 22px;
    }

    .idx-ab2 {
        margin-top: 40px;
    }

    .idx-ab2 {
        padding-bottom: 40px;
    }

    .idx-pro {
        padding: 40px 0;
    }

    .idx-ab1 {
        padding-top: 40px;
    }

    .idx-newsrtul > li .li_rt .t1 {
        font-size: 16px;
    }

    .idx-newsrtul > li .li_lt .d2 {
        font-size: 16px;
    }

    #swipernews .swiper-slide .pic .msk .t1 {
        font-size: 16px;
    }

    #swipernews .swiper-slide .pic .msk {
        padding: 20px;
    }

    .idx-news {
        padding: 40px 0;
    }

    .idx-caseul > li .li_box .infos .t1 {
        font-size: 16px;
    }

    .idx-caseul > li .li_box .infos {
        padding: 10px 13px;
    }

    .idx-tit h3 {
        font-size: 28px;
    }

    .aboutNav-ul > li {
        padding: 0px;
    }

    .about2-ul > li .li_box .infos .t1 {
        font-size: 16px;
        margin-bottom: 0;
    }

    .about2-ul > li .li_box .infos {
        padding: 10px 0;
        bottom: -34px;
    }

    .about2-ul > li {
        margin-bottom: 60px;
    }

    .about2 {
        padding-top: 40px;
        padding-bottom: 30px;
    }

    .sweq {
        width: 200px;
    }

    .sweq .swinfos .t1 {
        font-size: 14px;
    }

    .sweq .swinfos .t2 {
        font-size: 12px;
    }

    .about4 {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .sweq .simgbx {
        width: 140px;
        height: 140px;
    }

    .about3-content,
    .sweq {
        height: 430px;
    }

    .sweq .swinfos .dian::after {
        height: 90px;
    }

    .sweq .swinfos {
        padding-top: 10px;
    }

    .sweq2 .swinfos {
        padding-bottom: 10px;
    }

    .sweq2 .swinfos .dian::after {
        top: -92px;
    }

    .about5 {
        padding-top: 20px;
    }

    .about5-ul {
        margin-top: 20px;
    }

    .about7 {
        padding-bottom: 30px;
    }

    .about5-ul > li .li_box p {
        display: none;
    }

    .aboutyc1bg {
        padding: 90px 3%;
    }

    .aboutycdes {
        width: 90%;
        padding-top: 60px;
        padding-bottom: 35px;
    }

    .aboutycdes .tit {
        font-size: 24px;
    }

    .prodes1rt .title {
        font-size: 20px;
        margin-bottom: 10px;
    }

    .prodes1rt .dd1 p {
        line-height: 28px;
    }

    .prodes1rt .dd2 {
        margin-top: 10px;
    }

    .prodes1rt .dd2 ul li span {
        line-height: 28px;
    }

    .prosmallNav-lt img {
        width: 18px;
    }

    .prodes1rt .dd3 .dd3btn {
        width: 49%;
        margin-right: 0;
    }

    .prodes2-nav-ul > li {
        width: 100px;
        margin-right: 10px;
    }

    .contact2 {
        padding-top: 22px;
    }

    .contact2-ul > li:last-child {
        margin-bottom: 0;
    }

    .social-ul > li .li_rt .t1 {
        font-size: 16px;
    }

    .social-ul > li .li_rt .t4 {
        display: none;
    }

    .socialdes-cont .pic {
        width: 100%;
    }

    .newsdeslt .socialdes-cont {
        padding-left: 0;
        padding-right: 0;
    }

    .newsdeslt .title {
        font-size: 22px;
    }

    .newsdes {
        padding-top: 40px;
        padding-bottom: 10px;
    }

    .newsdesrt {
        margin-top: 20px;
    }

    .news-ul > li .li_box .infos .tit {
        font-size: 16px;
        margin-bottom: 6px;
    }

    .news-ul > li .li_box .infos {
        padding: 14px 20px;
    }
}

@media (max-width: 550px) {
    .header-lt .logort {
        padding-left: 6px;
        height: 31px;
        margin-left: 10px;
    }

    .header-lt .logo {
        width: 120px;
    }

    .header-lt .logort .p1 {
        margin-bottom: 0;
        margin-top: 7px;
    }

    .header-lt .logort .p2 {
        display: none;
    }

    .header-lt .logort .p2 strong {
        font-size: 12px;
        font-weight: normal;
    }

    .idx-ab1-ul > li.li_lt .box-bt {
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        background-color: #f8f8f8;
        padding-bottom: 30px;
        padding-left: 100px;
    }

    .idx-caseul > li .li_box .infos .t1 {
        margin-bottom: 0;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .idx-caseul > li .li_box .infos .t2 {
        font-size: 12px;
        line-height: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        margin-bottom: 0;
    }

    .idx-caseul > li .li_box .infos .t3 {
        width: 15px;
        height: 15px;
        backgrround-size: cover;
    }

    .idxpartul1 > li {
        width: 140px;
        height: 159px;
    }

    #swiperpartner .swiper-pagination-bullet {
        width: 14px;
    }

    .aboutNav-ul > li a p {
        font-size: 12px;
    }

    .aboutNav-ul > li a .img {
        width: 28px;
    }

    .aboutNav-ul > li.active a::after {
        width: 60px;
    }

    .about-tit .kuang {
        width: 80px;
        height: 80px;
    }

    .about-tit .kuangrt h3 {
        font-size: 26px;
    }

    .aboutyc3-ul .litp .litp-lt.fflex {
        flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }

    .pro-ul > li .li_box .infos {
        padding-left: 10px;
        padding-right: 10px;
    }

    .pro-ul > li .li_box .infos .t1 {
        font-size: 16px;
    }

    .aboutNav-ul > li {
        padding: 0px;
    }

    .prodes2-nav-ul > li {
        width: 86px;
        margin-right: 5px;
    }

    .prodes4-ul .li_lt {
        width: 100%;
        margin-bottom: 10px;
    }

    .cadb-ul > li .li_rt {
        width: 20px;
        height: 20px;
    }

    .techtit span {
        font-size: 20px;
    }

    .newsdesrt .ntit {
        width: 240px;
    }
}

@media (max-width: 420px) {
    .pro-ul > li {
        width: 100%;
    }

    .prodes2-nav-ul > li {
        width: 68px;
    }
}

@media (max-width: 2560px) and (min-width: 1600px) {
    .aboutNav-ul > li {
        padding: 0 50px;
    }

    .search-wrapper {
        opacity: 1;
        -webkit-transform: translate(0, 7px);
        -moz-transform: translate(0, 7px);
        transform: translate(0, 7px);
    }

    .search-wrapper .input-holder {
        overflow: hidden;
        height: 50px;
        background: rgba(221, 221, 221, 0);
        border-radius: 6px;
        position: relative;
        width: 40px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .search-wrapper.active .input-holder {
        border-radius: 50px;
        width: 300px;
        background: rgba(221, 221, 221, 0.8);
        -webkit-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -moz-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
    }

    .search-wrapper .input-holder .search-input {
        width: 100%;
        height: 36px;
        padding: 0px 50px 0 20px;
        opacity: 0;
        position: absolute;
        top: 0px;
        left: 0px;
        background: transparent;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border: none;
        outline: none;
        font-family: "Open Sans", Arial, Verdana;
        font-size: 16px;
        font-weight: 400;
        line-height: 20px;
        color: rgb(0, 0, 0);
        -webkit-transform: translate(0, 60px);
        -moz-transform: translate(0, 60px);
        transform: translate(0, 60px);
        -webkit-transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -moz-transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -webkit-transition-delay: 0.3s;
        -moz-transition-delay: 0.3s;
        transition-delay: 0.3s;
    }

    .search-wrapper.active .input-holder .search-input {
        opacity: 1;
        -webkit-transform: translate(0, 7px);
        -moz-transform: translate(0, 7px);
        transform: translate(0, 7px);
    }

    .search-wrapper.active .input-holder .search-input::placeholder {
        font-size: 15px;
    }

    .search-wrapper .input-holder .search-icon {
        width: 70px;
        height: 70px;
        border: none;
        border-radius: 6px;
        background: #FFF;
        padding: 0px;
        outline: none;
        position: relative;
        z-index: 2;
        float: right;
        cursor: pointer;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .search-wrapper.active .input-holder .search-icon {
        width: 50px;
        height: 50px;
        margin: 0px;
        border-radius: 30px;
    }

    .search-wrapper .input-holder .search-icon span {
        width: 22px;
        height: 22px;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
        -moz-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
        transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
    }

    .search-wrapper.active .input-holder .search-icon span {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .search-wrapper .input-holder .search-icon span::before,
    .search-wrapper .input-holder .search-icon span::after {
        position: absolute;
        content: '';
    }

    .search-wrapper .input-holder .search-icon span::before {
        width: 4px;
        height: 11px;
        left: 9px;
        top: 18px;
        border-radius: 2px;
        background: #f08e21;
    }

    .search-wrapper .input-holder .search-icon span::after {
        width: 14px;
        height: 14px;
        left: 0px;
        top: 0px;
        border-radius: 16px;
        border: 4px solid #f08e21;
    }
}

@media (max-width: 1601px) and (min-width: 1200px) {
    .aboutNav-ul > li {
        padding: 0 50px;
    }

    .search-wrapper {
        opacity: 1;
        -webkit-transform: translate(0, 7px);
        -moz-transform: translate(0, 7px);
        transform: translate(0, 7px);
    }

    .search-wrapper .input-holder {
        overflow: hidden;
        height: 50px;
        background: rgba(221, 221, 221, 0);
        border-radius: 6px;
        position: relative;
        width: 40px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .search-wrapper.active .input-holder {
        border-radius: 50px;
        width: 300px;
        background: rgba(221, 221, 221, 0.8);
        -webkit-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -moz-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
    }

    .search-wrapper .input-holder .search-input {
        width: 100%;
        height: 36px;
        padding: 0px 50px 0 20px;
        opacity: 0;
        position: absolute;
        top: 0px;
        left: 0px;
        background: transparent;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border: none;
        outline: none;
        font-family: "Open Sans", Arial, Verdana;
        font-size: 16px;
        font-weight: 400;
        line-height: 20px;
        color: rgb(0, 0, 0);
        -webkit-transform: translate(0, 60px);
        -moz-transform: translate(0, 60px);
        transform: translate(0, 60px);
        -webkit-transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -moz-transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
        -webkit-transition-delay: 0.3s;
        -moz-transition-delay: 0.3s;
        transition-delay: 0.3s;
    }

    .search-wrapper.active .input-holder .search-input::placeholder {
        font-size: 15px;
    }

    .search-wrapper.active .input-holder .search-input {
        opacity: 1;
        -webkit-transform: translate(0, 7px);
        -moz-transform: translate(0, 7px);
        transform: translate(0, 7px);
    }

    .search-wrapper .input-holder .search-icon {
        width: 70px;
        height: 70px;
        border: none;
        border-radius: 6px;
        background: #FFF;
        padding: 0px;
        outline: none;
        position: relative;
        z-index: 2;
        float: right;
        cursor: pointer;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .search-wrapper.active .input-holder .search-icon {
        width: 50px;
        height: 50px;
        margin: 0px;
        border-radius: 30px;
    }

    .search-wrapper .input-holder .search-icon span {
        width: 22px;
        height: 22px;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
        -moz-transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
        transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
    }

    .search-wrapper.active .input-holder .search-icon span {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .search-wrapper .input-holder .search-icon span::before,
    .search-wrapper .input-holder .search-icon span::after {
        position: absolute;
        content: '';
    }

    .search-wrapper .input-holder .search-icon span::before {
        width: 4px;
        height: 11px;
        left: 9px;
        top: 18px;
        border-radius: 2px;
        background: #f08e21;
    }

    .search-wrapper .input-holder .search-icon span::after {
        width: 14px;
        height: 14px;
        left: 0px;
        top: 0px;
        border-radius: 16px;
        border: 4px solid #f08e21;
    }
}

@media (max-width: 768px) {
    .search_box {
        display: none
    }

    .aboutNav-ul > li {
        padding: 0px;
    }
}

@media (max-width: 500px) {
    .idx-proul > li .li_box .img img {
        display: none;
    }

    .search_box {
        display: none
    }

    .aboutNav-ul > li {
        padding: 0px;
    }
}