html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block}
body {line-height:1}
ol,ul {list-style:none}
blockquote,q {quotes:none}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none}
table {border-collapse:collapse;border-spacing:0}
img {width:100%}
a {color:#fff;text-decoration:none}
html,body {font-family:"Microsoft YaHei";overflow-x:hidden}
.clearfix {clear:both}
.pull-left {float:left}
.pull-right {float:right}
#logo {cursor:pointer}
.swiper-container {width:1060px;margin:0 auto;height:300px}
.swiper-pagination-bullet {opacity:1 !important;width:19px !important;height:19px !important;background:#d8d8d8 !important}
.swiper-pagination-bullet-active {background:#c9b07a !important}
.swiper-slide .logo {width:173px;height:173px;border-radius:90px;background:#fff;float:left;margin-right:50px}
.swiper-slide .logo img {border-radius:90px}
.swiper-slide .brand-content {width:831px;height:188px;float:left;font-size:22px;line-height:47px;overflow:scroll;color:#999}
.floor {overflow:hidden;height: 640px;}
.floor .wrapper {width:1590px;max-width:1590px;margin:0 auto}
.floor .title {text-align:center;padding-top:90px;padding-bottom:72px;letter-spacing:2px}
.floor .title h1 {font-size:55px;height:55px;color:#333;padding-bottom:5px}
.floor .title .line {width:245px;height:2px;display:block;margin:0 auto}
.floor .sub-title {font-size:55px;color:#333;}
.floor .description {margin-top:41px;font-size:22px;line-height:38px;color:#333}
.navbar {position:fixed;top:0;width:100%;background:rgba(0,0,0,0);z-index:999;transition:all .5s}
.navbar .wrapper {width:90%;margin:0 auto;padding:15px;transition:all .5s}
.navbar .logo {width:140px}
.navbar-inverse {background:rgba(0,0,0,0.3)}
.navbar-inverse .wrapper {padding:5px}
.header {z-index:0;top:0;position:relative;height: auto;}
.header #logo {width:26%;left:12.55%;position:absolute;top:34%}
.header .slogan {font-size:45px;color:#fff;letter-spacing:5.7px;text-align:center;position:absolute;bottom: 127px;width:426px;left:50%;margin-left:-213px;z-index:10}
.header .slogan .jiaru {display:inline-block;width:257px;height:66px;background-color: #f10215;border-radius:30px;line-height:66px;font-size: 24px;color: #fff;}
.header .arrow {position:absolute;left:50%;margin-left:-10px;width:1.057%;bottom:21px;z-index:10}
.floor-2 .left-part {width:50%;height:100%}
.floor-2 .right-part {width:50%;height:100%}
.floor-2 .grid {width:50%;height:50%;position:relative;text-align:center}
.floor-2 .grid .shade {position:absolute;width:100%;height:100%;z-index:1;background:rgba(0,0,0,0);transition:all .5s;text-align:center;font-family:HanHei-SC}
.floor-2 .grid .job,.floor-2 .grid .tag {color:#fff;transition:all .8s;opacity:0;visibility:hidden}
.floor-2 .grid .job {margin-top:50%;font-size:55px;margin-bottom:30px}
.floor-2 .grid .tag {font-size:30px;padding:0 10px}
.floor-2 .grid:hover .shade {background:rgba(0,0,0,0.6)}
.floor-2 .grid:hover .shade .job,.floor-2 .grid:hover .shade .tag {visibility:visible;opacity:1}
.floor-2 .grid:hover .job {margin-top:45%}
.floor-2 .grid-1 {background:url(https://images.chuanboyi.com/202005/dd573f4430.jpg) 50%;background-size:cover}
.floor-2 .grid-2 {background:url(https://images.chuanboyi.com/202005/6530ea2bd7.jpg) 50%;background-size:cover}
.floor-2 .grid-3 {background:url(https://images.chuanboyi.com/202005/028beef0d8.jpg) 50%;background-size:cover;width:100%;margin-top: 320px;}
.floor-2 .grid-3 .job {margin-top:25%}
.floor-2 .grid-3:hover .job {margin-top:20%}
.floor-2 .grid-4 {background:url(https://images.chuanboyi.com/202005/532f2657db.jpg) 50%;background-size:cover;height:100%}
.floor-2 .grid-4 .job {margin-top:110%}
.floor-2 .grid-4:hover .job {margin-top:100%}
.floor-2 .grid-5 {background:url(https://images.chuanboyi.com/202005/0e8371f182.jpg) 50%;background-size:cover}
.floor-2 .grid-6 {background:url(https://images.chuanboyi.com/202005/f207ed64f6.jpg) 50%;background-size:cover}
.floor-3 .magazine {position:relative;width:1000px;margin-left:21px;margin-right:223px;float:left}
.floor-3 .magazine.open .p2 {left:265px;opacity:1}
.floor-3 .magazine.open .p3 {left:507px;opacity:1}
.floor-3 .magazine.open .p4 {left:690px;opacity:1}
.floor-3 .magazine .iPhone {width:387px;position:relative;z-index:9}
.floor-3 .magazine .p1 {position:absolute;width:335px;height:596px;top:89px;left:26px;z-index:10}
.floor-3 .magazine .p2 {position:absolute;width:378px;height:681px;top:50px;left:3px;z-index:8;opacity:.9;transition:all 1s;transition-timing-function:ease;-webkit-transition-timing-function:ease;box-shadow:0 0 8px #000}
.floor-3 .magazine .p3 {position:absolute;width:319px;height:578px;top:100px;left:3px;z-index:7;opacity:.9;transition:all .9s;transition-timing-function:ease;-webkit-transition-timing-function:ease;box-shadow:0 0 8px #000}
.floor-3 .magazine .p4 {position:absolute;width:275px;height:497px;top:140px;left:3px;z-index:6;opacity:.9;transition:all .8s;transition-timing-function:ease;-webkit-transition-timing-function:ease;box-shadow:0 0 8px #000}
.floor-3 .magazine .title .line {height:3px}
.floor-3 .right-box {float:left;width:264px;margin-top:196px;text-align:left}
.floor-4 {background:#f6f6f6}
.floor-4 .wrapper {padding-top:200px}
.floor-4 .left-part {width:352px;text-align:right;margin-left:75px;padding-top:151px}
.floor-4 .right-part {width:1004px;height:661px;margin-right:-74px;transition:all 1s}
.floor-4 .open {margin-right:30px}
.floor-5 {text-align:center}
.floor-5 .wrapper {padding:91px}
.floor-5 .work {width:1188px;height:605px;position:relative;margin:0 auto;margin-top:101px}
.floor-5 .work.open .work-picture {left:0}
.floor-5 .work.open .work-iphone {left:860px}
.floor-5 .work .work-picture {position:absolute;left:-60px;top:0;height:100%;width:100%;transition:all 1s}
.floor-5 .work .work-iphone {position:absolute;width:208px;height:407px;top:188px;left:920px;transition:all 1s}
.floor-6 {background:url(https://images.chuanboyi.com/202005/c51a93e0ad.jpg) 100%;background-attachment:fixed;background-position-x:0;position:relative}
.floor-6 .shade {width:100%;height:100%;background:rgba(0,0,0,0.65);}
.floor-6 .center-box {position:absolute;height:662px;top: 10%;left: 0%;text-align:center;}
.floor-6 h1 {font-size:55px;font-family:HanHei-SC;color:#fff;letter-spacing:2px}
.floor-6 .line {width:480px;height:3px;margin:0 auto;margin-top:6px}
.floor-6 .usage {/* width:100%; */margin-top: 106px;overflow: hidden;padding: 20px;}
.floor-6 .usage li {width: calc((100% - 30px) / 3);margin-right: 15px;float:left;color:#fff}
.floor-6 .usage li .icon {margin:0 auto;width:100px}
.floor-6 .usage li .ic-1 {height: 108px;}
.floor-6 .usage li .ic-2 {height:108px;margin-top:0}
.floor-6 .usage li .ic-3 {height: 108px;}
.floor-6 .usage li h6 {font-size: 26px;line-height:80px}
.floor-6 .usage li p {width: 100%;margin:0 auto;font-size: 22px;line-height:32px}
.floor-7 {width: 100%;margin:0 auto;text-align:center;}
.floor-7 .title {padding-top:68px;padding-bottom:75px;font-size: 40px;}
.floor-7 .title .line {width: 500px;}
.floor-7 .left-part,.floor-7 .right-part {width: 50%;box-shadow:0 0 12px #666;}
.floor-7 .box {width: 50%;height: 240px;float:left;text-align:center;position:relative;transition:all .3s}
.floor-7 .box img {position:absolute;width:100%;height:100%;left:0;top:0;z-index:1}
.floor-7 .box.ec {height: 480px;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;line-height:48px}
.floor-7 .tag {position:absolute;z-index:2;font-size:32px;font-family:HanHei-SC;color:#fff;top:50%;left:50%;margin-top:-32px;margin-left:-32px}
.floor-7 .tag.t1 {font-size:48px;margin-top:-48px;margin-left:-48px}
.floor-7 .tag.t6 {margin-left:-60px}
.floor-7 .tag.t5 {font-size:48px;letter-spacing:20px;margin-top:-55px}
.floor-7 .tag.t6 {margin-left:-60px}
.floor-7 .tag.t7 {margin-left:-60px}
.floor-8 {position:relative;background:url(https://images.chuanboyi.com/202005/4422503353.jpg) 50%;background-size:cover;background-attachment:fixed;background-position-x:0}
.floor-8 .services {width: 100%;text-align:center;color:#fff}
.floor-8 .services li {width: 32.333%;height:300px;float:left;border-right:.5px solid rgba(255,255,255,0.5);border-bottom:.5px solid rgba(255,255,255,0.5)}
.floor-8 .services li:nth-child(3n) {border-right:none}
.floor-8 .services li:nth-child(4),.floor-8 .services li:nth-child(5),.floor-8 .services li:nth-child(6) {border-bottom:none}
.floor-8 .services li img {width:50px;height:50px;margin-top:50px}
.floor-8 .services li h5 {font-size: 28px;line-height:80px}
.floor-8 .services li p {width:300px;margin:0 auto;font-size: 22px;line-height:32px;letter-spacing:.2px}
.floor-9 .customer {height:614px;background:#e8e8e8}
.floor-9 .customer .title {padding:80px 0}
.floor-9 .customer .title .line {width:242px}
.floor-9 .brand {height:466px;background:url(https://images.chuanboyi.com/202005/e1fe555d90.jpg) 50%;background-size:cover;position:relative}
.floor-9 .brand .logo-all {width:1360px;height:324.5px;position:absolute;top:50%;left:50%;margin-top:-162px;margin-left:-680px;display:none;}
.footer {height:660px;position:relative;color:#fff;background:url(https://images.chuanboyi.com/202005/ed04379e73.jpg) 50%;background-size:cover;}
.footer .footer-left {width: 100%;}
.footer .wrapper {padding: 25px;}
.whbaoming h3 {font-size: 36px;font-weight:700;}
.whbaoming h2 {font-size: 26px;margin-bottom:20px;margin-top:10px;}
.whbaoming-box {width: 100%;height: 80px;margin-bottom:15px;}
.whbaoming-box .whbaoming-form-element input {height: 80px;width:100%;padding-left:10px;background:#fff;text-align:left;color:#666;font-size: 28px;border:1px solid #dcdcdc;border-radius:4px;}
.whbaoming-box .whbaoming-form-element .submit {background-color:#f0ad4e;border:none;text-align:center;color:#fff;font-size: 30px;cursor:pointer;}