@keyframes imgbgAni {  0% {
 width:100%;
 left:0%;
}
 50% {
 width:120%;
 left:-10%;
}
 100% {
 width:100%;
 left:0%;
}
}
@keyframes ringScale { 0% {
 opacity: 1;
 -webkit-transform: scale(0.8);
 -moz-transform: scale(0.8);
 -ms-transform: scale(0.8);
 transform: scale(0.8);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(2.2);
 -moz-transform: scale(2.2);
 -ms-transform: scale(2.2);
 transform: scale(2.2);
}
}
.case_banner{ background-position: center center; background-attachment:fixed; background-repeat: no-repeat; position: relative; background-size:100% auto; }
.case_banner .container{position:relative; height:600px;}
.case_banCon{ position: absolute; left: 15px; top: 50%; right:15px; transform: translateY(-50%); color: #fff; font-size: 14px; line-height: 30px; padding-top:20px; }
.case_banCon strong{ font-size: 36px; display: block; line-height: 50px; margin-bottom: 18px; font-weight: normal; text-transform: uppercase; }
.case_banCon p{max-width: 585px;}
.ieBody .case_banCon{top:30%;}
.case_banner_img{position:absolute; right:-60px; top:257px;}
.casePart1{ padding: 0px 0px 145px; font-family: DINPro-Regular; }
.case_left { float: left; width: 50%; position: relative; }
.case_right { float: right; width: 50%; }
.casePart1Year { font: 36px/40px 'DINPro-Regular'; color: #0fc898; position: absolute; top: 0px; right: 30px; display: inline-block; }
.casePart1_des { color: #666; margin: 0 0 60px; font-size: 18px; line-height: 34px; }
.casePart1_des span{display:block; font-size:20px; color:#999;}
.casePart1_link{display:inline-block;}
.casePart1_link a { display: inline-block; vertical-align: middle; font-size: 16px; color: #c9c9c9; text-transform: capitalize; padding-bottom: 3px; border-bottom: 1px solid #c9c9c9; }
.casePart1_link:after { content: ''; display: inline-block; vertical-align: middle; width: 23px; height: 18px; background-position: center center; background-repeat: no-repeat; background-image: url(../case/common/icon1.png); margin: 1px 0 0 10px; opacity:0.5; transition:all 0.5s ease-in-out; }
.casePart1_link:hover:after{opacity:0.8;}
.casePart1_link:hover a{ color:#bbb; border-bottom:1px solid #0fc898}
.casePart1Endes { font-size: 16px; line-height: 32px; color: #888; text-align: justify; }
.casePart1Chdes { font-size: 16px; line-height: 32px; color: #666; margin-top: 40px; text-align: justify; }
.caseTitle{ height: 62px; position: relative; padding-left: 72px; font-family: "微软雅黑"; }
.caseTitle01{ margin: 195px 0px 52px; }
.caseTspan{ font-size: 60px; line-height: 62px; color: #0fc898; height: 62px; display: inline-block; position: absolute; left: 0px; top: 0px; font-family: DINPro-Regular; }
.caseTitle strong{ font-size: 30px; line-height: 38px; font-weight: 100; display: block; padding-top: 2px; }
.caseTen{ font-size: 14px; text-transform: uppercase; color: #999999; line-height: 22px; padding-right: 58px; position: relative; }
.caseTen i{ background: #DDDDDD; display: inline-block; height: 1px; width: 46px; position: absolute; top: 50%; right: 0px; }
.caseTen i:before{ content: ""; background: #0EC898; height: 1px; width: 7px; position: absolute; top: 0px; right: 0px; }
.caseTen i:after{ content: ""; background: #0ec898; height: 7px; width: 1px; position: absolute; top: -3px; right: 3px; }
.casePart2{ height:800px; height:100vh; width: 100%; background-position:center center; background-attachment:fixed; background-repeat:no-repeat; position:relative; background-size:cover;}
.caseImgBg_left{ width:9.37vw; background:#fff; position:absolute; left:0; top:0; bottom:0; z-index:10;}
.caseImgBg_right{ width:9.37vw; background:#fff; position:absolute; right:0; top:0; bottom:0; z-index:10;}
.casePart3{position:relative; z-index:3; margin-top:-400px; margin-top:-15vh; opacity:0; transition:all 0.8s ease-out; text-align:center;}
.casePart3.active{ margin-top:-50vh; opacity:1;}
.case_video_bg{ display:inline-block; position:relative;}
.case_video_bg .bg{ max-width:100vw; max-height:130vh; width:auto; height:auto; display:block;}
.case_video_img{display:none;}
.case_vimg {position: absolute;top: 18.6%;left: 13.7%;right: 13.7%;bottom: 26.4%; overflow:hidden; border-radius:0.6em;}
.case_video{ width:100%; display:block;}
.caseTitle02{margin-top:-35px;}
.caseText{ font-size: 16px; line-height: 30px; color: #888; text-align: center; margin: 75px auto 0px; max-width: 1100px; }
.caseText_title{ font-size: 30px; color: #333; line-height: 50px; margin-bottom: 20px; font-weight:100;}
.case_colors{ text-align: center; margin: 60px 0px 90px; }
.case_colors_item{ margin: 0px 50px; width: 175px; display: inline-block; padding: 8px 0px 0px 120px; font-size: 14px; line-height: 30px; color: #666666; position:relative; }
.color_rgb{ text-align:left;}
.color_rgb span{ display: inline-block; padding-right: 10px; }
.color_radius{ border-radius: 50%; display: inline-block; position: absolute; left: 0; top: 0; height: 105px; width: 105px; border-width: 10px; border-style: solid; line-height: 84px; text-align: center; text-transform: uppercase; font-family: DINPro-Regular; }
.caseP4box { width: 100%; position: relative; margin: 0 auto; border: 1px solid #000000; height:400px; height: 62vh; transition: 0.5s ease-in-out; opacity: 0; padding:0 35px; padding:0 3.7vh; }
.caseP4box:before { content: ""; position: absolute; left:35px; left: 3.7vh; top:35px; top: 3.7vh; right:35px; right: 3.7vh; bottom:35px; bottom: 3.7vh; border: 1px solid #000; transition: 0.5s ease-in-out; opacity: 0; }
.caseP4box ul { position: relative; display: block; height: 100%; }
.caseP4box li { position: absolute; top: -3.7vh; height: 0; transition: all 0.6s ease-in-out; border-left: 1px solid rgba(0,0,0,0.2); }
.caseP4box li:nth-child(1) { left: 0; width: 6.4%; }
.caseP4box li:nth-child(2) { left: 6.4%; width: 32%; }
.caseP4box li:nth-child(3) { left: 52.4%; width: 9.4%; }
.caseP4box li:nth-child(4) { left: 62.8%; width: 37%; }
.caseP4box li:nth-child(5) { right: -1px; width: 1px; }
.caseP4box li span { position: absolute; left: 50%; top: 66%; transform: translate(-50%, -50%); transition: all 0.5s ease-in-out; opacity: 0; font-size: 14px; line-height: 28px; }
.caseP4box.active { opacity: 1; }
.caseP4box.active:before { opacity: 1; transition-delay: 0.2s }
.caseP4box.active li:nth-child(1) { height: 70vh; transition-delay: 0.3s }
.caseP4box.active li:nth-child(2) { height: 70vh; transition-delay: 0.5s }
.caseP4box.active li:nth-child(3) { height: 70vh; transition-delay: 0.7s }
.caseP4box.active li:nth-child(4) { height: 70vh; transition-delay: 0.9s }
.caseP4box.active li:nth-child(5) { height: 70vh; transition-delay: 1.1s }
.caseP4box.active li:nth-child(1) span { opacity: 1; top: 50%; transition-delay: 1.4s }
.caseP4box.active li:nth-child(2) span { opacity: 1; top: 50%; transition-delay: 1.6s }
.caseP4box.active li:nth-child(3) span { opacity: 1; top: 50%; transition-delay: 1.8s }
.caseP4box.active li:nth-child(4) span { opacity: 1; top: 50%; transition-delay: 2.0s }
.caseP4box.active li:nth-child(5) span { opacity: 1; top: 50%; transition-delay: 2.2s }
.caseTitle03{ margin: 135px 0px 0px; }
.case_web_img{ margin-top:60px; max-width:1536px; margin-left:auto; margin-right:auto;}
.case_web_img img{width:100%; height:auto; display:block; border-radius:1.2em; border: 18px solid #000; background:#000;margin-bottom:20px; box-shadow:0 30px 60px rgba(0, 0, 0, 0.2);}
.case_web_img img:last-child{margin-bottom:0;}
.caseText2{margin-top:120px;}
.casePart2a{ margin-top:60px;}
.casePart6{ padding-top: 135px; text-align: center; font-family: "微软雅黑"; }
.caseBom_t1{ font-size: 24px; font-style: italic; color: #999999; line-height: 46px; margin-bottom:10px; }
.caseBom_bt{ font-size: 30px; line-height: 34px; font-weight:100; }
.casePart5{ padding-bottom:258px; padding-bottom: 33vh; overflow: hidden; position: relative; max-width:1920px; margin:0 auto; }
.caseP5bg { position: absolute; left: 0%; bottom: 0; animation: imgbgAni 30s linear infinite; width: 100%; height: auto; max-width: none!important; }
.caseP5con{position:relative; margin-top:-45px;}
.radar span { width:480px; height:480px; width: 25vw; height: 25vw; position: absolute; top: 80%; left: 50%; margin:-240px 0 0 -240px; margin: -10.5vw 0 0 -10.5vw; border-radius: 50%; background: rgba(0, 0, 0, 0.05); opacity: 0; z-index: 0; -webkit-animation: ringScale 4.2s linear infinite; -moz-animation: ringScale 4.2s linear infinite; -ms-animation: ringScale 4.2s linear infinite; animation: ringScale 4.2s linear infinite; z-index:5; }
.radar span:nth-of-type(2) { animation-delay: 1.4s; }
.radar span:nth-of-type(3) { animation-delay: 2.8s; }
.case5_page1 { width: 51.04vw; border: 12px solid #000; border-radius: 1.0em; position: absolute; left: 13.78vw; top: 5.93vw; z-index: 5; background:#000; }
.case5_page1 img,.case5_page4 img,.case5_page3 img{border-radius:0.4em;}
.case5_page2 { position: absolute; left: 0; top: 20vw; width: 11.19vw; z-index: 8; }
.case5_page2 img { border-radius: 1.2em; border:9px solid #000; }
.case5_page3 { width: 34.85vw; border: 10px solid #000; border-radius: 1.0em; position: absolute; left: 10vw; bottom: 0; z-index: 8; background:#000 }
.case5_page4 { width: 22.25vw; border: 10px solid #000; border-radius: 1.0em; position: absolute; right: 0; top: 20vw; z-index: 8; background:#000; }
.caseBom_st{ font-size: 14px; color: #999999; line-height: 26px; text-align: center; margin: 8px 0px 35px; }
.case_tel{text-align:center}
.case_telbtn{ line-height: 30px; display: inline-block; height: 30px; background: url(../case/common/tel_icon.png) no-repeat left center; padding-left: 45px; font-size: 26px; color: #0fc898; font-family: DINPro-Regular; }
.case_more { margin: 45px 0px 75px; height: 51px; position: relative; text-align:center }
.case_more:before{ content: ""; background: #D4D4D4; height: 1px; width: 100%; position: absolute; top: 50%; left:0 }
.case_moreBnt{ line-height: 49px; height: 51px; width: 250px; text-align: center; display: inline-block; border: 1px solid #0EC898; border-radius: 1.8em; font-size: 16px; color: #0ec898; position:relative; z-index:1; background:#fff; }
.case_moreBnt:hover{ color: #FFF; background: #0ec898; }
.cases_list{position:relative; z-index:2; padding-bottom:40px;}
.cases_list ul{ margin:0 -35px;}
.cases_catgory_name{ font-size: 20px; line-height: 30px; margin-bottom:40px; font-weight:bold;}
.cases_list li{width:33.333%; float:left; padding:0 35px; margin-bottom:30px}
.case_item{display:block; text-align:center;}
.case_img{border: 8px solid #F0F0F0; border-radius:0.5em; background:#fff; position:relative; *zoom: 1; margin-bottom:20px}
.case_img img{display:block; max-width:100%; height:auto;}
.case_img:before {-webkit-transform: skew(-15deg) rotate(-4deg);-moz-transform: skew(-15deg) rotate(-4deg);transform: skew(-15deg) rotate(-4deg);left:12%;}
.case_img:after {-webkit-transform: skew(15deg) rotate(4deg);-moz-transform: skew(15deg) rotate(4deg); transform: skew(15deg) rotate(4deg);right: 12%;}
.case_img:before,.case_img:after {width:70%;height: 65%;content: '';-webkit-box-shadow: 0 18px 26px rgba(0, 0, 0, 0.25);-moz-box-shadow: 0 18px 26px rgba(0, 0, 0, 0.25);box-shadow: 0 18px 26px rgba(0, 0, 0, 0.25);position: absolute;bottom:8px;z-index: -1;}
.case_item strong{ font-size: 18px; line-height: 40px; font-weight: normal; display: block; }
.case_item p{ font-size: 12px; line-height: 22px; color: #999999; height: 44px; overflow: hidden; }
@media (min-width:2000px){
.case5_page1{width:62%; left:18.8%;}
.case5_page2{width:13.7%;}
.case5_page4{width:26.15%;}
.case5_page3{width:41.66%;}
}
@media (max-width:1799px){
.case_banner .container{height:62.88vh;}
.case_banCon{line-height:26px;}
.case_banCon strong{font-size:28px; line-height:42px; margin-bottom:10px;}
.case_banner_img{width:53.38vw; top:25.5vh;}
.caseTitle01{margin-top:132px; margin-bottom:35px;}
.casePart1Endes{line-height:30px;}
.casePart1Chdes{line-height:30px; font-size:14px;}
.casePart1{padding-bottom:88px;}
.caseText_title{font-size:28px; line-height:40px; margin-bottom:15px;}
.caseText{margin-top:35px; font-size:15px;}
.case_colors{margin-top:50px;}
.case_web_img{margin-top:38px;}
.case_web_img img{ border-width:12px;}
.caseText2{margin-top:85px;}
.caseP5con{margin-top:-50px;}
.casePart2a{margin-top:40px;}
.casePart6{padding-top:80px;}
.case5_page1 {border: 10px solid #000; width:45vw;}
.case5_page2 img { border:7px solid #000; }
.case5_page3 { border: 8px solid #000;}
.case5_page4 { border: 8px solid #000;}
.caseBom_bt{font-size:26px;}
.case_more { margin: 35px 0px 55px;}
.cases_list ul{margin:0 -25px;}
.cases_list ul li{padding:0 25px;}
.casePart1Year{font-size:30px; line-height:30px;}
}
@media (max-width:1559px){
.case5_page1 { left:14.78vw; width:52.2vw;}
}
@media (max-width:1379px){
.case_banner_img{top:21.5vh;}
.case5_page1 { width:54.8vw;}
}
@media (max-width:1199px){
.case_banner .container{height:380px;}
.case_banner_img{top:200px; right:0}
.case_banCon p{max-width:485px;}
.case_left{width:100%; float:none}
.case_right{width:100%; float:none; margin-top:35px;}
.casePart1_des{margin-bottom:12px;}
.case_colors_item{margin:0 18px;}
.caseTitle03{margin-top:90px;}
.caseP5con{margin-top:-15px;}
.caseText{padding-left:15px; padding-right:15px;}
.cases_list ul{margin:0 -15px;}
.cases_list ul li{padding:0 15px;}
.casePart2{height:500px; background-attachment:scroll;}
.case5_page1{left:16.78vw; top:7.93vw; width:52.2vw}
.case5_page3{bottom:4.1vh; left:14vw;}
.case_video{display:none;}
.case_video_img{display:block;}
}
@media (max-width:993px){
.case_colors_item{margin:0; padding-left:115px;}
.case_banner_img{top:290px;}
.casePart3{margin-bottom:40px;}
.caseP4box.active li{height:300px!important;}
.caseP4box{height:220px;}
.caseText_title{font-size:26px;}
.case_item strong{font-size:16px;}
.case5_page3{bottom:7.1vh;}
.case_banner{background-size:130% auto; }
}
@media (max-width:767px){
.top_empty{height:0;}
.case_banner{background-size:auto 500px; }
.case_banner .container{height:440px;}
.case_banCon strong{font-size:22px; line-height:32px;}
.case_banCon{font-size:12px; line-height:24px; transform:translateY(0); top:85px;}
.case_banner_img{width:330px; top:325px;}
.caseTitle01{margin-top:70px; margin-bottom:18px;}
.caseTitle strong{font-size:22px; padding-top:5px; line-height:34px;}
.casePart1_des{font-size:16px; line-height:28px;}
.casePart1_des span{font-size:16px;}
.casePart1Year{right:0; top:-76px; font-size:24px; line-height:26px;}
.casePart1Endes{font-size:14px; line-height:24px;}
.casePart1Chdes {margin-top:20px; line-height:26px;}
.casePart1{padding-bottom:55px;}
.casePart3.active{margin-top:-100px;}
.casePart2{height:215px;}
.caseImgBg_left,.caseImgBg_right{width:0;}
.caseText_title{font-size:20px; line-height:32px;}
.caseText{padding-left:0; padding-right:0;font-size:14px; line-height:28px;}
.caseText_title{font-size:16px; font-weight:bold; line-height:30px; margin-bottom:12px;}
.case_colors_item{width:162px; padding-left:100px; line-height:24px; font-size:14px; padding-top:2px;}
.color_radius{border-width:6px; width:86px; height:86px; line-height:74px;}
.case_colors{margin-top:32px; margin-bottom:45px;}
.case_colors_item{height:105px;}
.caseP4box:before{left:10px; right:10px; top:10px; bottom:10px;}
.caseP4box{padding:0 11px 0 10px;}
.caseP4box li span{font-size:12px!important;}
.caseTen{font-size:13px;}
.caseP4box li:nth-child(1) { width: 10.4%; }
.caseP4box li:nth-child(2) { left: 10.4%; width: 40%; }
.caseP4box li:nth-child(3) { left: 53.4%; width: 11.4%; }
.caseP4box li:nth-child(4) { left: 64.8%; width: 36%; }
.caseP4box li{top:-30px;}
.caseP4box.active li{ height:280px!important;}
.caseTitle03{margin-top:68px;}
.case_web_img{margin-top:20px;}
.case_web_img img{border-radius:0.8em; border-width:7px;}
.casePart5 .caseText{margin-top:55px;}
.case5_page1 {border: 4px solid #000; border-radius:0.4em;}
.case5_page2 img { border:2px solid #000; border-radius:0.3em }
.case5_page3 { border: 3px solid #000; border-radius:0.3em}
.case5_page4 { border: 3px solid #000; border-radius:0.3em}
.case5_page1 img, .case5_page4 img, .case5_page3 img{border-radius:0.2em;}
.caseP5con{margin-top:0;}
.casePart5{padding-bottom:20vh;}
.caseText2{margin-top:56px;}
.casePart6{padding-top:38px;}
.caseBom_t1{margin-bottom:2px; font-size:20px;}
.caseBom_bt{font-size:17px; line-height:30px;}
.caseBom_st{margin-bottom:15px; font-size:12px; line-height:22px; margin-top:5px;}
.case_moreBnt{ line-height: 42px; height: 43px; width: 160px; font-size: 14px; }
.case_more{height:43px;}
.cases_list ul li{width:100%; margin-bottom:15px;}
.casePart2a {margin-left:15px; margin-right:15px; width:auto;}
.case_img{max-width:457px; margin:0 auto;}
.case_banCon{padding-top:10px;}
}

/*case_4*/
.cell_box { font-size: 0; }
.cell_box:before { content: ''; height: 100%; display: inline-block; vertical-align: middle; }
.cell_box .cell { width: 100%; display: inline-block; vertical-align: middle; }
 @keyframes bgScale {  0% {
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 transform: scale(1);
}
 50% {
 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 -ms-transform: scale(1.1);
 transform: scale(1.1);
}
 100% {
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 transform: scale(1);
}
}
.new-link{ float:left; width:auto; display:inline-block; font-size:16px; color:#979797; padding-bottom:5px; border-bottom:1px solid #c9c9c9; transition:all 0.5s ease;}
.new-link a{ color:#bbb}
.case4_page .wow { visibility: hidden; }
.case4_page .hidden { overflow: hidden; }
.case4_page .comm_txt h3 { font-size: 30px; line-height: 40px; color: #333; text-align: center; font-weight:normal }
.case4_page .comm_txt p { font-size: 16px; line-height: 2; color: #888; max-width:1100px; margin-left:auto; margin-right:auto; text-align:center; margin-top: 20px; }
.case4_page .comm_txt .tip { overflow: hidden; }
.case4_page .comm_txt .tip span { font-size: 24px; color: #000; font-weight: bold; }
.case4_page .comm_txt .tip span:nth-of-type(1) { float: left; }
.case4_page .comm_txt .tip span:nth-of-type(2) { float: right; }
.case4_page .section1 { padding: 9vw 0 6vw; font-size: 0; }
.case4_page .section1 .main { width: 80vw; max-width: 1440px; margin: 0 auto; }
.case4_page .section1 .left { width: 50%; display: inline-block; vertical-align: top; position: relative; }
.case4_page .section1 .left .year { position: absolute; top: 0; right: 30px; font-size: 36px; line-height: 1; display: none; }
.case4_page .section1 .left h3 { font-size: 30px; color: #4a4a4a; line-height: 40px; font-weight:normal; }
.case4_page .section1 .left p { font-size: 20px; line-height: 34px; color: #979797; margin: 2vw 0; }
.case4_page .section1 .left .link { font-size: 0; }
.case4_page .section1 .left .link .s_box {display: inline-block; vertical-align: top; width: 36px; height: 36px; position: relative;}
.case4_page .section1 .left .link .s_box a{background-image: url("../images/icon1.png");display: block; height: 36px; background-position:right 4px; background-repeat: no-repeat;}
.case4_page .section1 .right { width: 50%; display: inline-block; vertical-align: top; position: relative; }
.case4_page .section1 .right .year { position: absolute; top: 0; right: calc(100% + 30px); font-size: 36px; line-height: 1;}
.case4_page .section1 .right .en { font-size: 16px; line-height: 32px; color: #888; text-align: justify; }
.case4_page .section1 .right .zh { font-size:16px; line-height: 32px; color: #666; margin-top: 40px; text-align: justify; }
.case4_page .section2 img.bg_img { display: block; width: 100%; }
.case4_page .section2 .cont { width: 70vw; max-width: 1280px; margin: 0 auto; position: relative; margin-top: -15vw; }
.case4_page .section2 .video_box { position: relative; margin-bottom: 4vw; }
.case4_page .section2 .video_box img.computer { display: block; width: 100%; }
.case4_page .section2 .video_box .shadow { position: absolute; bottom: -9.2vw; left: -6.25vw; right: -6.25vw; height: 10.2vw; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/shadow-1.png"); }
.case4_page .section2 .video_box .cont { position: absolute; left: 0; right: 0; margin: 0 auto; width: 79.2%; max-width: 1014px; top: 1.8%; border-radius: 20px 20px 0 0; overflow: hidden; }
.case4_page .section2 .video_box .cont img { width: 100%;}
.case4_page .section2 .video_box .cont video { display: block; width: 100%; position:absolute; left:0; top:0; }
.case4_page .section2 .hide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0), black); background: -o-linear-gradient(180deg, rgba(0, 0, 0, 0), black); background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0), black); background: linear-gradient(180deg, rgba(0, 0, 0, 0), black); opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
.case4_page .section2 .hide a { position: absolute; bottom: 2.5vw; left: 50%; font-size: 24px; color: #fff; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); opacity: 0; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; cursor:pointer; }
.case4_page .section2 .hide a:after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background-color: #fff; transform-origin: left center; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: transform 0.3s ease; -moz-transition: transform 0.3s ease; -ms-transition: transform 0.3s ease; transition: transform 0.3s ease; }
.case4_page .section2 .hide a:hover:after { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); }
.case4_page .section2 .active .hide { opacity: 1; visibility: visible; }
.case4_page .section2 .active .hide a { opacity: 1; bottom: 4.5vw; }
.case4_page .section3 { width: 80vw; max-width: 1440px; margin: 0 auto; margin-top: -6vw; }
.case4_page .section3 .cont { width: 70vw; max-width: 1280px; margin: 0 auto; padding: 4vw 4vw 0; font-size: 0; display: flex; justify-content: space-between; box-sizing:content-box; }
.case4_page .section3 .txt_box { display: inline-block; vertical-align: middle; }
.case4_page .section3 .txt_box.min { width: 260px; }
.case4_page .section3 .txt_box .box { margin-top: 6vw; }
.case4_page .section3 .txt_box .box:nth-of-type(1) { margin-top: 0; }
.case4_page .section3 .txt_box h3 { font-size: 24px; line-height: 1; color: #3482fd; font-weight:normal }
.case4_page .section3 .txt_box .tip { margin-top: 20px; }
.case4_page .section3 .txt_box .tip span { font-size: 16px; line-height: 1; color: #808080; display: inline-block; vertical-align: top; margin-right: 30px; }
.case4_page .section3 .txt_box .tip span:last-of-type { margin-right: 0; }
.case4_page .section3 .img_box { width: 25%; max-width: 272px; }
.case4_page .section3 .img_box img { display: block; width: 100%; }
.case4_page .section4 { width: 80vw; max-width: 1440px; margin: 6vw auto 0; }
.case4_page .section4 .cont { width: 70vw; max-width: 1280px; margin: 0 auto; padding: 4vw 4vw 0; font-size: 0; position: relative; box-sizing:content-box; }
.case4_page .section4 .cont .color { position: absolute; right: 100%; top: -2vw; width: 10.5%; max-width: 134px; }
.case4_page .section4 .cont .color img { display: block; width: 100%; }
.case4_page .section4 .item { display: inline-block; vertical-align: top; width: calc((100% - 40px) / 3); margin-right: 20px; }
.case4_page .section4 .item:nth-of-type(3n) { margin-right: 0; }
.case4_page .section4 .item:nth-of-type(4), .case4_page .section4 .item:nth-of-type(5), .case4_page .section4 .item:nth-of-type(6) { margin-top: 3vw; }
.case4_page .section4 .item .bg { height: 6.25vw; }
.case4_page .section4 .item h3 { font-size: 16px; line-height: 1; color: #000000; font-weight: bold; margin-top: 2vw; }
.case4_page .section4 .item p { font-size: 12px; color: #808080; line-height: 1; margin-top: 10px; }
.case4_page .section5 { width: 80vw; max-width: 1440px; margin: 6vw auto 0; position: relative; }
.case4_page .section5 .cont { width: 70vw; max-width: 1280px; margin: 4vw auto 0; position: relative; }
.case4_page .section5 .cont img.home { position: absolute; left: calc(100% + 4vw); top: 56%; width: 10.5%; max-width: 134px; }
.case4_page .section5 .block { position: relative; width: 89%; max-width: 1136px; margin: 4vw auto 0; }
.case4_page .section5 .block .page { padding: 6vw 0; box-shadow: 0 4vw 4vw rgba(0, 0, 0, 0.1); }
.case4_page .section5 .block .translate { -webkit-transform: translateY(-28vh); -moz-transform: translateY(-28vh); -ms-transform: translateY(-28vh); transform: translateY(-28vh); }
.case4_page .section5 .block img.move { display: block; width: 100%; }
.case4_page .section5 .video_box { position: absolute; left: -13.36%; right: -13.36%; top: 7vw; }
.case4_page .section5 .video_box img.computer { display: block; width: 100%; }
.case4_page .section5 .video_box .shadow { position: absolute; bottom: -7.3vw; left: -3vw; right: -3vw; height: 8.6vw; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/shadow-2.png"); }
.case4_page .section6 { width: 66.67%; max-width: 1280px; margin: 6vw auto 0; position: relative; }
.case4_page .section6 .web { position: absolute; right: 100%; top: 36vw; width: 10.5%; max-width: 134px; }
.case4_page .section6 .web img { display: block; width: 100%; }
.case4_page .section6 .items { margin: 0 -4vw; }
.case4_page .section6 .items:after { content: ''; display: block; clear: both; }
.case4_page .section6 .item { width: 60vw; max-width: 1120px; -webkit-transition: box-shadow 0.3s 0.8s ease; -moz-transition: box-shadow 0.3s 0.8s ease; -ms-transition: box-shadow 0.3s 0.8s ease; transition: box-shadow 0.3s 0.8s ease; }
.case4_page .section6 .item .box { clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%); -webkit-transition: clip-path 0.8s ease; -moz-transition: clip-path 0.8s ease; -ms-transition: clip-path 0.8s ease; transition: clip-path 0.8s ease; overflow: hidden; position:relative; }
.case4_page .section6 .item img { display:block; width: 100%; }
.case4_page .section6 .item video { display: block; width: 100%; -webkit-transform: scale(1.4); -moz-transform: scale(1.4); -ms-transform: scale(1.4); transform: scale(1.4); -webkit-transition: transform 0.8s ease; -moz-transition: transform 0.8s ease; -ms-transition: transform 0.8s ease; transition: transform 0.8s ease; position:absolute; left:0; top:0; }
.case4_page .section6 .item:nth-of-type(1) { float: left; }
.case4_page .section6 .item:nth-of-type(2) { float: right; margin-top: 6vw; }
.case4_page .section6 .item.active { box-shadow: 0 2vw 4vw rgba(0, 0, 0, 0.2); }
.case4_page .section6 .item.active .box { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
.case4_page .section6 .item.active video { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.case4_page .section7 { font-size: 0; margin-top: 6vw; }
.case4_page .section7 .item { display: inline-block; vertical-align: top; width: 50%; height: 100vh; position: relative; }
.case4_page .section7 .item.pc_box .cont img, .case4_page .section7 .item.pc_box .cont video { max-width: 33.33vw; max-height: 60vh; }
.case4_page .section7 .item.phone_box .cont img, .case4_page .section7 .item.phone_box .cont video { max-width: 17vw; max-height: 60vh; }
.case4_page .section7 .item .tit { position: absolute; top: 8vh; left: 0; right: 0; text-align: center; font-size: 24px; color: #fff; font-weight: bold; }
.case4_page .section7 .item .cont { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transform-style: preserve-3d; }
.case4_page .section7 .item .cont img, .case4_page .section7 .item .cont video { box-shadow: 2vw 2vw 4vw rgba(0, 0, 0, 0.2); }
.case4_page .section7 .item .cont img { display:block; }
.case4_page .section7 .item .cont video { display: block; position:absolute; left:0; top:0; width:100%; height:auto; }
.case4_page .section8 { background-color: #f5f5f5; padding: 6vw 0; position: relative; }
.case4_page .section8:after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 32vw; background-image: linear-gradient(180deg, rgba(245, 245, 245, 0), whitesmoke); }
.case4_page .section8 .cont { width: 80%; max-width: 1440px; margin: 0 auto; }
.case4_page .section8 .block { width: 70vw; max-width: 1280px; margin: 4vw auto 0; }
.case4_page .section8 .items { font-size: 0; margin-top: 4vw; }
.case4_page .section8 .left_box, .case4_page .section8 .center_box, .case4_page .section8 .right_box { display: inline-block; vertical-align: top; }
.case4_page .section8 .left_box, .case4_page .section8 .right_box { width: 26.5%; }
.case4_page .section8 .center_box { width: 34%; margin: 9vw 6.5% 0; }
.case4_page .section8 .right_box { margin-top: 3vw; }
.case4_page .section8 .item { margin-top: 6vw; box-shadow: 0 2vw 4vw rgba(0, 0, 0, 0.1); }
.case4_page .section8 .item:nth-of-type(1) { margin-top: 0; }
.case4_page .section8 .item img { display: block; width: 100%; }
.case4_page .section1 .main{width: 66vw}
.case4_page .section8 .center_box{width:100% ;margin:0px;}
.case4_page .section8 .center_box .item{width:59%;margin:0px auto ;}
.case4_page .section8 .items_more{}
.case4_page .section8 .items_more .center_box{width: 34%; margin: 9vw 6.5% 0;}
.case4_page .section8 .items_more .center_box .item{width:100%; margin-top:6vw;}
@media screen and (max-width: 1600px) {
.case4_page .section1 .left .year,  .case4_page .section1 .right .year { font-size: 30px; }
.case4_page .section1 .left h3,  .case4_page .comm_txt h3 { font-size: 26px; line-height: 36px; }
.case4_page .section1 .left p { line-height: 30px; font-size:18px; }
.case4_page .section1 .right .en { line-height: 26px; font-size:16px; }
.case4_page .section1 .right .zh { line-height: 28px; font-size:14px; }
.case4_page .comm_txt p { font-size: 15px; line-height: 30px; }
.case4_page .section3 .txt_box.min { width: 200px; }
.case4_page .section1 .main{width:1140px;}
}
@media screen and (max-width: 1379px) {
.case4_page .comm_txt p{font-size:14px; line-height:28px;}
}
@media (max-width:1199px){
.case4_page .section1 .main{width:940px;}
}
@media screen and (max-width: 993px) {
.case4_page .section1 { padding: 80px 0 35px; }
.case4_page .section1 .main { width: 90%; }
.case4_page .section1 .left { width: 100%; }
.case4_page .section1 .left .year, .case4_page .section1 .right .year { font-size: 26px; }
.case4_page .section1 .left .year { display: block; }
.case4_page .section1 .left h3 { font-size: 20px; line-height: 30px; }
.case4_page .section1 .left p { font-size: 16px; line-height: 26px; margin: 15px 0 0; }
.case4_page .section1 .left .link { display: none; }
.case4_page .section1 .right { width: 100%; margin-top: 15px; }
.case4_page .section1 .right .year,  .case4_page .section1 .right .en { display: none; }
.case4_page .section1 .right .zh { font-size: 14px; line-height: 24px; margin-top: 0; }
.case4_page .section2 { overflow: hidden; }
.case4_page .section2 .cont { width: 90%; margin-top: -10%; }
.case4_page .section2 .video_box { margin-bottom: 20px; }
.case4_page .section2 .video_box .cont { width: 76%; border-radius: 5px 5px 0 0; top: 5%; }
.case4_page .section2 .video_box .cont img { display: block; }
.case4_page .section2 .hide a { font-size: 16px; white-space: nowrap; }
.case4_page .comm_txt h3 { font-size: 18px; line-height: 24px; }
.case4_page .comm_txt p { font-size: 14px; line-height: 28px; margin-top: 10px; }
.case4_page .section3 { padding: 40px 0; width: 90%; margin-top: 0; }
.case4_page .section3 .cont { width: 100%; padding: 0; margin-top: 20px; }
.case4_page .section3 .txt_box h3 { font-size: 18px; }
.case4_page .section3 .txt_box .tip { margin-top: 10px; }
.case4_page .section3 .txt_box .tip span { font-size: 12px; margin-right: 15px; }
.case4_page .section3 .txt_box .box { margin-top: 20px; }
.case4_page .section3 .txt_box.min { display: none; }
.case4_page .section3 .img_box { width: 30%; }
.case4_page .section4 { width: 90%; margin: 0 auto; }
.case4_page .section4 .cont .color { display: none; }
.case4_page .section4 .cont { width: 100%; padding: 0; margin-top: 20px; }
.case4_page .section4 .item .bg { height: 50px; }
.case4_page .section4 .item h3 { font-size: 14px; margin-top: 10px; }
.case4_page .section4 .item p { margin-top: 5px; }
.case4_page .section5 { padding: 40px 0; width: 90%; margin: 0 auto; }
.case4_page .section5 .cont { width: 100%; margin: 20px 0 0; }
.case4_page .section5 .cont img.home { top: 62%; left: calc(100% + 10px); }
.case4_page .section5 .block { margin: 20px auto 0; width: 76%; }
.case4_page .section5 .block .page { padding: 0; }
.case4_page .section5 .block .translate { -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); }
.case4_page .section5 .video_box { top: -6px; }
.case4_page .section6 { width: 90%; margin: 0 auto; padding-bottom: 40px; }
.case4_page .section6 .web { right: auto; left: 0; top: 60%; width: 7.5%; }
.case4_page .section6 .items { margin: 0; }
.case4_page .section6 .item { width: 80%; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); }
.case4_page .section6 .item:nth-of-type(2) { margin-top: 20px; }
.case4_page .section6 .item .box { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
.case4_page .section6 .item img { display: block; }
.case4_page .section7 { margin-top: 0; }
.case4_page .section7 .item { width: 100%; height: auto; padding: 80px 0 40px; }
.case4_page .section7 .item .cont img { display: block; }
.case4_page .section7 .item.pc_box .cont img { max-width: 80%; max-height: none; margin: 0 auto; }
.case4_page .section7 .item.phone_box .cont img { max-width: 36%; max-height: none; margin: 0 auto; }
.case4_page .section7 .item .cont { position: static; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; }
.case4_page .section7 .item .tit { font-size: 16px; top: 40px; }
.case4_page .section8 { padding: 40px 0; }
.case4_page .section8 .cont { width: 90%; }
.case4_page .comm_txt .tip span { font-size: 16px; }
.case4_page .section8 .block { width: 100%; margin-top: 10px; }
.case4_page .section8 .items { margin-top: 20px; }
.case4_page .section1 .main{width:90%}
.case4_page .section1 .left .year{right:0;}
}
@media screen and (max-width:768px){
.case4_page .section8 .center_box .item{width:90%;}
.case4_page .comm_txt h3{font-size:16px; font-weight:bold;}
.case4_page .section5 .video_box {top: -3px;}
}
/*case_4 end*/