.index_pro .pro_info .pro_title .title_right .right_btn{ display:inline-block; cursor:pointer }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_left{ float:left }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_left:hover{ transform:scale(1.2); transition:all .5s }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_right{ float:left; padding-left:8px }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_right:hover{ transform:scale(1.2); transition:all .5s }

.index_pro .pro_info .pro_list{ overflow:hidden }

.index_pro .pro_info .pro_list .img_list{ width:9999px; touch-action:none }

.index_pro .pro_info .pro_list .img_list a{ max-width:690px; height:472px; overflow:hidden; display:inline-block; margin-right:6px }

.index_pro .pro_info .pro_list .img_list img{ width:100% }

.index_pro .pro_info .pro_list .img_list img:hover{ transform:scale(1.2); transition:all 1s }

.index_brand{ width:100%; max-width:1920px; height:960px; max-height:960px; background:url(../images/index_brand_bg.jpg);margin:auto; overflow:hidden }

.index_brand .index_brand_info{ width:1400px; margin:150px auto }

.index_brand .index_brand_info .brand_title{ float:left }

.index_brand .index_brand_info .brand_content{ float:right }

.index_brand .index_brand_info .brand_content .brand_content1{ float:left; width:498px; height:434px; color:#fff; background:url(../images/index_brand_img1.png) no-repeat top center; background-size:100%; padding:91px 55px 94px 51px }

.index_brand .index_brand_info .brand_content .brand_content1 .bt{ font-size:49px }

.index_brand .index_brand_info .brand_content .brand_content1 .bt span{ font-size:20px; float:right; font-weight:bold }

.index_brand .index_brand_info .brand_content .brand_content1 .bt:after{ content:''; display:block; width:24px; height:4px; background:#fff; margin:16px 0 23px 0 }

.index_brand .index_brand_info .brand_content .brand_content1 .jsh{ font-size:18px; line-height:28px; padding-right:27px; height:140px; overflow:hidden }

.index_brand .index_brand_info .brand_content .brand_content1:hover{ transform:scale(1.1); transition:all .5s }

.index_brand .index_brand_info .brand_content .brand_content2{ float:left; margin-top:10px; position:relative; left:-20px; width:449px; height:496px; color:#fff; background:url(../images/index_brand_img2.png) no-repeat top center; background-size:100%; padding:43px 24px 94px 44px }

.index_brand .index_brand_info .brand_content .brand_content2 .bt{ font-size:49px }

.index_brand .index_brand_info .brand_content .brand_content2 .bt span{ font-size:20px; float:right; font-weight:bold; margin-top:-25px }

.index_brand .index_brand_info .brand_content .brand_content2 .bt:after{ content:''; display:block; width:24px; height:4px; background:#fff; margin:16px 0 23px 0 }

.index_brand .index_brand_info .brand_content .brand_content2 .jsh{ font-size:18px; line-height:28px; padding-right:24px; height:142px; overflow:hidden }

.index_brand .index_brand_info .brand_content .brand_content2:hover{ transform:scale(1.1); transition:all .5s }

.index_client{ width:100%; max-width:1920px; height:635px; max-height:635px; background-color:#fff; overflow:hidden; margin:auto }

.index_client .client_info{ width:1400px; height:545px; margin:100px auto; overflow:hidden }

.index_client .client_info .client_left{ float:left }

.index_client .client_info .client_tabs{ margin:50px 0 100px 0 }

.index_client .client_info .client_tabs .tabs_item{ cursor:pointer; margin-right:30px; display:inline-block; font-size:20px; color:#222 }

.index_client .client_info .client_tabs .active{ font-weight:bold }

.index_client .client_info .client_right{ float:right }

.index_client .client_info .client_right .icon_list{ max-width:900px; width:100%; height:345px }

.index_client .client_info .client_right .icon_list .list_item{ cursor:pointer; width:16%; display:inline-block; padding:20px 20px }

.index_client .client_info .client_right .icon_list .list_item img{ width:90% }

.index_client .client_info .client_right .icon_list .list_item img:hover{ opacity:1; transform:scale(1.2); filter:grayscale(0); transition:all .5s }

.mobile_banner{ display:none }

.mobile_brand_content{ display:none }

.mobile_client_title{ display:none }

.index_case{ background:#f9f9f9; height:auto; max-height:none }

.index_case .client_info{ height:auto }

.index_case .client_info .client_left{ float:none; padding-bottom:80px }

.index_case .client_info .client_right{ float:none }

.ellipsis{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap }

.case{ font-size:16px }

.case .middleCenter{ position:absolute; top:0; bottom:0; left:0; right:0; max-width:100%; max-height:100%; display:block; vertical-align:middle; text-align:center; margin:auto }

.case img{ max-width:100%; max-height:100% }

.case .list{ margin-left:-10px; margin-right:-10px; overflow:hidden }

.case li{ width:33.333333333333336%; padding:0 10px; float:left; margin-bottom:40px }

.case li img{ transition:all .5s; transform:scale(1.0000001) }

.case li .box{ display:block; color:#fff; position:relative }

.case li .pic{ overflow:hidden; display:block; position:relative }

.case li .pic:after{ content:""; display:block; padding-top:80% }

.case li .pic:before{ content:""; display:block; width:100%; height:100%; position:absolute; z-index:1; background:#01758f; display:none \9; opacity:0; transition:200ms opacity linear }

.case li .text{ background:rgba(0, 35, 64, 0.7); color:#fff; padding:24px 25px 30px 25px; position:absolute; bottom:0; width:100%; transition:all .2s; z-index:2; text-align:justify }

.case li .bt{ color:#fff; font-size:30px; display:block; height:50px; line-height:50px; transition:all .5s; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }

.case li .jsh{ font-size:15px; line-height:24px; height:48px; overflow:hidden; margin-bottom:20px }

.case li .more{ position:absolute; bottom:-23px; width:100% }

.case li .more span{ display:inline-block; background:#fff; border:2px #fff solid; font-size:13px; color:#002340; padding:0 30px; line-height:42px; min-width:160px; text-align:center; transition:background .2s, border .2s; position:relative; box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.1) }

.case li .more span:after{ content:""; display:inline-block; width:15px; height:15px; background:url(../images/arrow-right-02.png) no-repeat center center; vertical-align:middle; margin-top:-3px; margin-left:16px; transition:all .2s }

.case li:hover img{ transform:scale(1.05) }

.case li:hover .pic:before{ opacity:.5 }

.case li:hover .text{ padding-bottom:70px }

.case li:hover .jsh{ height:96px }

.case li:hover .more span{ background:#002340; color:#fff }

.case li:hover .more span:after{ background:url(../images/arrow-right-01.png) no-repeat center center; margin-left:20px }

.case li:nth-child(even) .text{ background:rgba(222, 0, 0, 0.7) }

.case li:nth-child(even) .more span{ color:#de0000 }

.case li:nth-child(even) .more span:after{ background:url(../images/arrow-right-03.png) no-repeat center center }

.case li:nth-child(even):hover .pic:before{ background:#de0000 }

.case li:nth-child(even):hover .more span{ color:#fff; background:#ca1517 }

.case li:nth-child(even):hover .more span:after{ background:url(../images/arrow-right-01.png) no-repeat center center }

.case li.even .text{ background:#ca1517 }

.case li.even .more span{ color:#ca1517 }

.case li.even .more span:after{ background:url(../images/arrow-right-03.png) no-repeat center center }

.case li.even:hover .pic:before{ background:#ca1517 }

.case li.even:hover .more span{ background:#ca1517 }

.case li.even:hover .more span:after{ background:url(../images/arrow-right-01.png) no-repeat center center }

@media (max-width:1279px){
.case li .bt{ font-size:24px }
}

@media (max-width:1100px){
.case li{ width:100% }
}

@media (max-width:767px){
.case .list{ max-width:625px; margin-left:auto; margin-right:auto }

.case li{ width:100% }

.case li .box{ padding-bottom:132px }

.case li .text{ padding:14px 10px 20px 10px }

.case li .bt{ font-size:18px; height:30px; line-height:30px }

.case li .jsh{ font-size:12px }

.case li .more span:after{ background:url(../images/arrow-right-02-phone.png) no-repeat center center; background-size:contain }

.case li:hover img{ transform:scale(1) }

.case li:hover .pic:before{ display:none }

.case li:hover .text{ padding-bottom:20px }

.case li:hover .jsh{ height:48px }

.case li:hover .more span{ background:#fff; color:#01758f }

.case li:hover .more span:after{ background:url(../images/arrow-right-02-phone.png) no-repeat center center; background-size:contain; margin-left:16px }

.case li:nth-child(even) .more span{ background:#fff !important; color:#ca1517 !important }

.case li:nth-child(even) .more span:after{ background:url(../images/arrow-right-03-phone.png) no-repeat center center; background-size:contain }

.case li.even .more span{ background:#fff !important; color:#ca1517 !important }

.case li.even .more span:after{ background:url(../images/arrow-right-03-phone.png) no-repeat center center; background-size:contain }
}

@media screen and (max-width:1400px){
.index_pro .pro_info{ width:1100px }

.index_client .client_info{ width:1100px }

.index_brand .index_brand_info{ width:1100px }

.index_pro .pro_info .pro_list .img_list a{ width:550px }

.index_about .about_right .right_img img{ position:relative; left:50%; transform:translateX(-50%) }
}

@media screen and (max-width:1100px){
.index_pro .pro_info{ width:900px }

.index_client .client_info{ width:900px }

.index_brand .index_brand_info{ width:900px }

.index_pro .pro_info .pro_list .img_list a{ width:450px }

.index_brand .index_brand_info .brand_content .brand_content1{ float:none }

.index_brand .index_brand_info .brand_content .brand_content2{ float:none; left:0; margin-top:60px }

.index_brand .index_brand_info{ margin:30px auto }

.index_client .client_info .client_right .icon_list{ width:600px }

.index_brand{ height:auto; max-height:none; background:url(../images/index_brand_bg.jpg); background-size:cover }
}

@media screen and (max-width:900px){
.index_about .about_left{ width:100% }

.index_about .about_right{ width:100% }

.index_pro .pro_info{ width:100%; margin:30px 0 }

.index_pro{ height:555px }

.index_pro .pro_info .pro_title{ float:none; width:90%; margin:0 auto; padding-bottom:30px }

.index_pro .pro_info .pro_list{ width:450px; margin:auto }

.index_brand .index_brand_info{ width:100%; padding:14% }

.index_brand .index_brand_info .brand_title{ float:none }

.index_brand .index_brand_info .brand_content{ float:none }

.index_brand .index_brand_info .brand_content .brand_content1{ margin:0 auto }

.index_brand .index_brand_info .brand_content .brand_content2{ margin:50px auto 0 auto }

.index_client .client_info{ width:100%; padding:5%; margin:0 auto; height:100% }

.index_client .client_info .client_left{ float:none; position:relative }

.index_client .client_info .client_left .client_btn{ position:absolute; top:0; right:0 }

.index_client .client_info .client_right{ float:none }

.index_client .client_info .client_tabs{ margin:20px 0 }

.index_client .client_info .client_right .icon_list{ width:100% }

.index_client .client_info .client_right .list1{ margin-bottom:50px }

.index_client .client_info .client_right .icon_list .list_item{ width:32%; padding:30px }

.index_client{ max-height:800px; height:800px }

.index_case{ height:auto; max-height:none }

.index_news{ height:auto; max-height:none }

.index_brand .index_brand_info .brand_content .brand_content2{ left:0 }

.index_case .client_info .client_left{ padding-bottom:30px }
}

@media screen and (max-width:550px){
.index_about{ height:auto }

.index_about .about_right{ height:100% }

.index_about .about_right .right_img img{ width:100% }

.index_about .about_right .right_img .play_icon img{ width:20% }

.index_about .about_left{ height:320px }

.index_about .about_left .left_info{ width:80% }

.index_about .about_left .left_info .more_btn img{ width:35% }

.index_pro .pro_info .pro_title{ width:80% }

.index_pro .pro_info .pro_title .title_left{ width:40% }

.index_pro .pro_info .pro_title .title_left img{ width:100% }

.index_pro .pro_info .pro_title .title_right{ width:60%; text-align:right }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_left{ width:44% }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_left img{ width:80% }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_left:hover{ transform:scale(1) }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_right{ width:50% }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_right img{ width:80% }

.index_pro .pro_info .pro_title .title_right .right_btn .btn_right:hover{ transform:scale(1) }

.index_about .about_left .left_info .title{ padding-bottom:30px }

.index_about .about_left .left_info .title img{ width:70% }

.index_pro .pro_info .pro_list{ width:300px }

.index_pro .pro_info .pro_list .img_list a{ width:300px; height:auto }

.index_pro{ height:390px; background-size:900px }

.mobile_brand_content{ display:block }



.index_brand .index_brand_info .brand_title img{ width:32%; margin-bottom:30px }

.index_about .about_left .left_info .about_font{ font-size:14px; padding-bottom:30px }

.index_brand{ height:100%; background:url(../images/index_brand_mobile_bg.jpg); background-size:600px }

.client_title img{ width:27%; margin-top:70px }

.index_client .client_info .client_tabs .tabs_item{ font-size:16px }

.index_brand .index_brand_info .brand_content .brand_content1 img{ width:100% }

.index_brand .index_brand_info .brand_content .brand_content2 img{ width:100% }

.index_client .client_info .client_right .icon_list .list_item{ padding:15px }

.index_client{ height:100%; max-height:100% }

.index_client .client_info .client_right .list1{ margin-bottom:0 }

.footer .footer_info .footer_share a .fooer_code{ right:-15px }

.index_pro .pro_info .pro_list .img_list img{ transform:scale(1.3) }

.mobile_client_title{ display:block }

.pc_client_title{ display:none }

.index_brand .index_brand_info .brand_content .brand_content1{ width:100%; height:auto; padding:90px 45px 75px 45px }

.index_brand .index_brand_info .brand_content .brand_content1 .bt{ font-size:25px }

.index_brand .index_brand_info .brand_content .brand_content1 .jsh{ font-size:16px }

.index_brand .index_brand_info .brand_content .brand_content2{ width:100%; height:auto; padding:90px 45px 121px 45px; margin-top:30px }

.index_brand .index_brand_info .brand_content .brand_content2 .bt{ font-size:25px }

.index_brand .index_brand_info .brand_content .brand_content2 .jsh{ font-size:16px }
}

@media (max-width:414px){
.index_brand .index_brand_info .brand_content .brand_content1{ padding:57px 36px 14px 36px; background:url(../images/index_brand_img1.png) no-repeat top center; background-size:cover }

.index_brand .index_brand_info .brand_content .brand_content2{ padding:40px 20px 72px 20px; background:url(../images/index_brand_img2.png) no-repeat top center; background-size:cover }
}

@media (max-width:375px){
.index_brand .index_brand_info .brand_content .brand_content2{ padding:40px 20px 41px 20px }
}

@media (max-width:360px){
.index_brand .index_brand_info .brand_content .brand_content1 .jsh{ font-size:14px; line-height:25px; padding-right:0; height:125px }

.index_brand .index_brand_info .brand_content .brand_content2 .jsh{ font-size:14px; line-height:25px; padding-right:0; height:100px }
}

@media (max-width:320px){
.index_brand .index_brand_info .brand_content .brand_content2 .bt span{ margin-top:0 }

.index_brand .index_brand_info .brand_content .brand_content2{ padding:9px 20px 41px 20px }
}

.index_news{ height:auto; max-height:none }