*{margin: 0;padding: 0;transition: all .2s;-webkit-transition: all .2s;-webkit-font-smoothing: antialiased;font-family: "Helvetica Neue", Helvetica, "PingFang SC", 微软雅黑, Tahoma, Arial, sans-serif;}
html,body{padding: 0;margin: 0;min-width: 1200px;transition: none;-webkit-transition: none;width: 100%;height: 100%;/*overflow-x: hidden;*/}
html{overflow-x: hidden;}
body{width: calc(100% + 12px);}
@media screen and (max-width: 1200px){
    html{overflow-x: auto;}
    body{width: 100%;}
}
.body-wrap{width: 100%;height: 100%;}
a{color: inherit;text-decoration: none;}
a:hover,a:focus{color: inherit;text-decoration: none;}
a:focus{outline: none;outline-offset: 0;}
input.error{border-color: #ff0000 !important;}

.animated{-webkit-animation-duration: 0.5s;animation-duration: 0.5s;}

.fl{float: left;}
.fr{float: right;}
.btn{display: block;text-decoration: none;}
.btn.btn-yellow{width: 180px;height: 50px;line-height: 50px;background: #fff110;color: #030f32;font-size: 20px;text-align: center;padding: 0;}
/*scroll bar*/
::-webkit-scrollbar{width: 12px;height: 10px;}
::-webkit-scrollbar-track,::-webkit-scrollbar-thumb{border-radius: 999px;border: 2px solid transparent;}
::-webkit-scrollbar-track{}
::-webkit-scrollbar-thumb{min-height: 20px;background-clip: content-box;box-shadow: 0 0 0 5px #ccc inset;background-color: none;}
::-webkit-scrollbar-corner{background: transparent;}
/*selection*/
::selection{background: #ccaa77;color: #fff;}
::-moz-selection{background: #ccaa77;color: #fff;}
::-webkit-selection{background: #ccaa77;color: #fff;}
/*placeholder*/
::-webkit-input-placeholder{color: #999;}
:-moz-placeholder{color: #999;}
::-moz-placeholder{color: #999;}
:-ms-input-placeholder{color: #999;}

.section{padding: 100px 0;overflow: hidden;}

.ui-main{position: relative;width: 1200px;display: block;margin: 0 auto;overflow: visible;}
.btn-demand{width: 100px;height: 100px;text-align: center;line-height: 100px;background-color: #fde224;color: #333;font-size: 18px;position: fixed;right: 40px;bottom: 18px;border-radius: 50%;z-index: 120;transition: none;-webkit-transition: none;}
.site-cases-page2-page .btn-demand{display: none;}
.video-wrap{position: relative;}
.video-wrap .video-bg{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background-size: cover;background-position: 50% 50%;-webkit-filter: blur(8px);-moz-filter: blur(8px);-o-filter: blur(8px);-ms-filter: blur(8px);filter: blur(8px);}
video{cursor: pointer;display: block;margin: 0 auto;transition: none;-webkit-transition: none;height: 100%;}
.default__controls{transform: translateY(52px);}
.content{padding: 0;margin: 0;}
.hidden{display: none !important;}
.tagsinput-wrap{min-height: 60px;margin: 20px 0;margin-top: 12px;}
.tagsinput-wrap .bootstrap-tagsinput{min-height: 60px;padding: 0;border: 1px solid #e5e5e5;margin: 0;background: #f5f5f5;padding: 0 10px;padding-bottom: 18px;}
.tagsinput-wrap .bootstrap-tagsinput .badge{height: 24px;margin: 18px 3px 0 3px;max-width: 100%;}
.tagsinput-wrap .bootstrap-tagsinput .badge > span:after{line-height: 24px;}
.tagsinput-wrap .bootstrap-tagsinput input{max-width: 100%;margin: 0 !important;height: 100% !important;padding: 0 10px !important;display: inline-block !important;background: none !important;border: none !important;min-width: 100px !important;height: 24px !important;font-size: 16px;margin-top: 18px !important;}
.modal-open{overflow-y: hidden;overflow: auto;}
.modal-open .section-header{width: 100%;}
.modal-open .btn-demand{right: 52px;}
.modal-open.site-cases-page .section-header{width: calc(100% + 12px);}
.modal-open.site-cases-page .btn-demand{right: 40px;}

.btn-check-all-wrap{text-align: center;}
.btn-check-all-wrap .btn-check-all{font-size: 20px;color: #1f2437;padding: 0 5px;padding-bottom: 6px;border-bottom: 4px solid #fff110;display: inline-block;margin: 0 auto;margin-top: 50px;}

.block-title{width: 560px;height: 45px;line-height: 45px;text-align: center;font-size: 20px;color: #333;position: relative;margin: 0 auto;margin-bottom: 40px;}
.block-title .title{padding: 0 20px;display: block;margin: 0 auto;background: #fff;display: inline-block;z-index: 5;position: relative;}
.block-title.bg-gray-custome .title{background: #f5f5f5;}
.block-title.bg-yellow .title{background: #FFF548;}
.block-title .wire{position: absolute;width: 100%;height: 1px;background: #333;left: 0;top: 22px;}

.swiper-container{position: relative;}
.swiper-button{position: absolute;width: 125px;height: 100%;top: 0;display: flex;align-items: center;justify-content: center;margin-top: 0;background: none;outline: none;border: none;}
.swiper-butto.swiper-button-disabled{opacity: 0;-webkit-opacity: 0;}
.swiper-button-prev{left: -125px;}
.swiper-button-next{right: -125px;}
.swiper-button div{width: 68px;height: 68px;line-height: 68px;text-align: center;cursor: pointer;border-radius: 50%;display: flex;align-items: center;justify-content: center;background-size: 30px auto;background-repeat: no-repeat;background-position: 50% 50%;}
.swiper-button div i{color: rgba(127,127,127,1);font-size: 25px;}
.swiper-button-prev div{background-image: url(../images/arrow_left_black.png);}
.swiper-button-next div{background-image: url(../images/arrow_right_black.png);}
.swiper-button:hover div{background-color: rgba(0,0,0,0.4);}
.swiper-button:hover div i{color: rgba(255,255,255,1);}
.swiper-button-prev:hover div{background-image: url(../images/arrow_left_white.png);}
.swiper-button-next:hover div{background-image: url(../images/arrow_right_white.png);}
@media screen and (max-width: 1450px){
    .swiper-button{z-index: 20;opacity: 0;-webkit-opacity: 0;}
    .swiper-button.actived{opacity: 1;-webkit-opacity: 1;}
    .swiper-button-prev{left: 0;}
    .swiper-button-next{right: 0;}
    .swiper-button div{width: 65px;height: 65px;border-radius: 50%;background-color: rgba(0,0,0,0.3);opacity: 0.8;-webkit-opacity: 0.8;}
    .swiper-button:hover div{/*background-color: rgba(0,0,0,0.4);*/opacity: 1;-webkit-opacity: 1;}
    .swiper-button-prev div{background-image: url(../images/arrow_left_white.png);}
    .swiper-button-next div{background-image: url(../images/arrow_right_white.png);}
    .swiper-button-disabled{opacity: 0 !important;-webkit-opacity: 0 !important;}
}

/*header*/
.section-header{position: fixed;background: rgba(45,45,45,0.98);height: 50px;padding: 0;box-sizing: border-box;z-index: 80;transition: none;-webkit-transition: none;width: calc(100% + 12px);top: 0;z-index: 1000;}
@media screen and (max-width: 1200px){
    .section-header{padding-right: 15px;width: calc(100% + 12px);}
    .section-header .ui-main{width: 100%;}
}
.section-header .block-header{height: 100%;transition: none;-webkit-transition: none;}
.section-header .block-header .logo-wrap{height: 100%;float: left;display: flex;align-items: center;justify-content: center;}
.section-header .block-header .logo-wrap .logo{height: 17px;display: inline-block;}
.section-header .block-header .fr{display: flex;align-items: center;justify-content: center;}
.section-header .block-header .menus{display: inline-block;height: 50px;line-height: 50px;margin-right: 25px;position: relative;}
.section-header .block-header .menus a{color: #999;font-size: 18px;display: inline-block;margin: 0 25px;box-sizing: border-box;line-height: 43px;float: left;height: 50px;border-top: 4px solid rgba(45,45,45,0.98);border-bottom: 4px solid rgba(45,45,45,0.98);}
.section-header .block-header .menus a.actived{color: rgba(255,255,255,1);border-top: 4px solid #fff548;}
.section-header .block-header .menus .border{height: 4px;background: #fff548;position: absolute;top: 0;}
.section-header .block-header .btn-settled{font-size: 17px;color: #999;width: 100px;height: 30px;line-height: 28px;border: 1px solid rgba(45,45,45,0.98);border-radius: 100px;text-align: center;margin-right: 42px;}
.section-header .block-header .btn-settled:hover{border: 1px solid #ccc;color: #fff;}
.section-header .block-header .contact-way{float: right;font-size: 17px;color: #999;height: 30px;line-height: 28px;border: 1px solid rgba(45,45,45,0.98);border-radius: 100px;text-align: center;margin-right: 42px;}

/*footer*/
.section-footer{height: 350px;padding: 0;background: #1F2437;}
.section-footer .block-footer{padding-top: 80px;}
.section-footer .block-footer .title{color: #fff;font-size: 36px;}
.section-footer .block-footer .subtitle{color: #999999;font-size: 18px;margin-top: 15px;}
.section-footer .block-footer .btn-yellow{margin-top: 50px;}
.section-footer .block-footer p{color: #f5f5f5;font-size: 14px;margin-top: 10px;text-align: right;}
.section-footer .block-footer p:nth-child(4){margin-top: 50px;}
.section-footer .block-footer .fr a{display: block;color: #f5f5f5;font-size: 14px;margin-top: 10px;text-align: right;}{}

/*footer-simplify*/
.section-footer-simplify{padding: 0;height: 90px;line-height: 90px;text-align: center;color: ;background: #030f32;color: #f5f5f5;font-size: 14px;}
.section-footer-simplify{}

/*banner*/
.section-banner{padding: 0;height: 100%;transition: all 0.5s;}
.section-banner .block-banner{height: 100%;color: #fff;text-align: center;position: relative;display: flex;align-items: center;justify-content: center;background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;}
.section-banner .block-banner .bg{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0,0,0,0.5);}
.section-banner .block-banner .video-wrap{width: 100%;height: 100%;}
.section-banner .block-banner .content-wrap{position: absolute;width: 100%;height: 100%;left: 0;top: 0;display: flex;align-items: center;justify-content: center;}
.section-banner .block-banner .content-wrap .title-before{font-size: 24px;width: 560px;margin: 0 auto;}
.section-banner .block-banner .content-wrap .title{font-size: 64px;line-height: 90px;margin-top: 30px;}
.section-banner .block-banner .content-wrap .subtitle{font-size: 24px;}
.section-banner .block-banner .content-wrap .loading{position: absolute;width: 20px;bottom: 5px;left: calc(50% - 10px);height: 35px;overflow: hidden;}
.section-banner .block-banner .content-wrap .loading .loading-item{color: #fff;position: absolute;width: 100%;left: 0;opacity: 0.2;}
.section-banner .block-banner .content-wrap .loading .loading-item:nth-child(1){bottom: 15px;font-size: 15px;transform: scale(0.7);animation: arrowdown_one 1s infinite;}
.section-banner .block-banner .content-wrap .loading .loading-item:nth-child(2){bottom: 8px;font-size: 15px;transform: scale(0.8);animation: arrowdown_two 1s infinite;}
.section-banner .block-banner .content-wrap .loading .loading-item:nth-child(3){bottom: 0;font-size: 15px;animation: arrowdown_three 1s infinite;}
@keyframes arrowdown_one{
    0%{opacity: 0.2;}
    30%{opacity: 1;}
    60%{opacity: 0.2;}
}
@keyframes arrowdown_two{
    20%{opacity: 0.2;}
    50%{opacity: 1;}
    80%{opacity: 0.2;}
}
@keyframes arrowdown_three{
    40%{opacity: 0.2;}
    70%{opacity: 1;}
    100%{opacity: 0.2;}
}
.section-banner-numbers{height: 256px;padding: 0;}
.block-banner-numbers .numbers{width: 1120px;height: 256px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;}
.block-banner-numbers .numbers .item{text-align: center;}
.block-banner-numbers .numbers .item:nth-child(1){min-width: 225px;}
.block-banner-numbers .numbers .item:nth-child(2){min-width: 115px;}
.block-banner-numbers .numbers .item:nth-child(3){min-width: 115px;}
.block-banner-numbers .numbers .item:nth-child(1){min-width: 225px;}
.block-banner-numbers .numbers .item .number{display: block;/*height: 122px;*/font-size: 100px;font-weight: bold;}
.block-banner-numbers .numbers .item .des{font-size: 24px;display: block;}
.section-banner .block-banner .line{height: 1px;background-color: #fff;display: block;}
.section-banner .block-banner .line-short{width: 210px;display: inline-block;margin-top: 16px;}
.section-banner .block-banner .line-short.line-short-left{float: left;}
.section-banner .block-banner .line-short.line-short-right{float: right;}
.section-banner .block-banner .line-middle{width: 560px;margin: 30px auto;}
.section-banner .block-banner .line-long{width: 1200px;margin: 30px auto;}

/*cases*/
.section-cases{background: #f5f5f5;}
.section-cases .swiper-container-cases{height: 480px;width: 1200px;overflow: visible;}
.section-cases .swiper-container-cases .swiper-wrapper{}
.unit-project{display: block;width: 1200px;height: 480px;}
.unit-project .left-part{width: 440px;height: 100%;float: left;background: #fff;color: #9c9c9c;padding: 40px 50px 0 50px;box-sizing: border-box;transition: background 0.3s;-webkit-transition: background 0.3s;}
.unit-project .left-part .company{font-size: 20px;}
.unit-project .left-part .title{font-size: 24px;margin-top: 10px;}
.unit-project .left-part .subtitle{font-size: 14px;margin-top: 10px;}
.unit-project .left-part .tags{margin-top: 20px;}
.unit-project .left-part .tags .tag{height: 30px;line-height: 30px;border-radius: 15px;text-align: center;font-size: 14px;margin-left: 10px;border: 1px solid #9c9c9c;display: inline-block;padding: 0 10px;}
.unit-project .left-part .tags .tag:nth-child(1){margin-left: 0;}
.unit-project .left-part .time{font-size: 16px;margin-top: 23px;}
.unit-project .left-part .price{font-size: 16px;margin-top: 23px;}
.unit-project .left-part .designers{font-size: 16px;margin-top: 23px;}
.unit-project .left-part .designers .label-custome{}
.unit-project .left-part .designers .designer-wrap{margin-top: 10px;overflow: hidden;}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved{}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper{}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide{text-align: center;display: inline-block;margin-left: 30px;float: left;width: auto;}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide:nth-child(1){margin-left: 0;}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide .avatar-wrap{width: 60px;height: 60px;border-radius: 50%;overflow: hidden;display: block;margin: 0 auto;}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide .avatar-wrap img{height: 100%;-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);}
.unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide .name{margin-top: 6px;font-size: 15px;}
.unit-project .right-part{width: 760px;float: right;height: 480px;overflow: hidden;}
.unit-project .right-part img{height: 100%;-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);}
.unit-project:hover .right-part img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);transition: all 0.5s;-webkit-transition: all 0.5s;}
.section-cases .swiper-container-cases .swiper-wrapper .swiper-slide.swiper-slide-active{}
.section-cases .swiper-container-cases .swiper-wrapper .swiper-slide.swiper-slide-active .left-part{width: 440px;height: 100%;float: left;background: #FFF548;color: #333;padding: 40px 50px 0 50px;box-sizing: border-box;transition: background 0.3s;-webkit-transition: background 0.3s;}
.section-cases .swiper-container-cases .swiper-wrapper .swiper-slide.swiper-slide-active .left-part .tags .tag{border: 1px solid #333;}
.section-cases .swiper-container-cases .swiper-wrapper .swiper-slide.swiper-slide-active .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide .avatar-wrap img{-webkit-filter: grayscale(100%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}
.section-cases .swiper-container-cases .swiper-wrapper .swiper-slide.swiper-slide-active .right-part img{-webkit-filter: grayscale(100%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}
.section-project-list{padding: 80px;}
.section-project-list .project-wrap{margin-top: 40px;}
.section-project-list .unit-project .left-part{width: 440px;height: 100%;float: left;background: #FFF548;color: #333;padding: 40px 50px 0 50px;box-sizing: border-box;transition: background 0.3s;-webkit-transition: background 0.3s;}
.section-project-list .unit-project .left-part .tags .tag{border: 1px solid #333;}
.section-project-list .unit-project .left-part .designers .designer-wrap .swiper-container-designers-involved .swiper-wrapper .swiper-slide .avatar-wrap img{-webkit-filter: grayscale(100%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}
.section-project-list .unit-project .right-part img{-webkit-filter: grayscale(100%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}

/*service*/
.section-service{}
.section-service .item-service{}
.section-service .item-service .des{width: 100%;height: 485px;position: relative;margin-bottom: 40px;}
.section-service .item-service .des .brief{position: absolute;width: 490px;height: 435px;left: 0;bottom: 40px;background: #1f2437;z-index: 5;font-size: 24px;color: #fff;padding: 50px 40px;overflow: hidden;box-sizing: border-box;}
.section-service .item-service .des .brief .title{margin-top: 20px;}
.section-service .item-service .des .brief .line-service{width: 80px;height: 1px;background: #fff;margin: 40px 0;}
.section-service .item-service .des .brief .description{font-size: 14px;line-height: 22px;}
.section-service .item-service .des .banner-service{position: absolute;width: 1020px;height: 440px;right: 0;top: 0;background-repeat: no-repeat;background-size: cover;background-position: 50% 50%;}
.section-service .item-service.opposite{}
.section-service .item-service.opposite .des{}
.section-service .item-service.opposite .des .brief{right: 0;left: auto;}
.section-service .item-service.opposite .des .banner-service{left: 0;right: auto;}
.section-service .item-service .details{width: 100%;height: 230px;display: flex;align-items: center;justify-content: left;}
.section-service .item-service .details .detail{width: 33%;height: 100%;color: #2B2E40;}
.section-service .item-service .details .detail:nth-child(2){width: 34%;margin: 0 50px;}
.section-service .item-service .details .detail .top{}
.section-service .item-service .details .detail .top .detail-logo{width: 60px;height: 60px;float: left;}
.section-service .item-service .details .detail .top .detail-logo img{width: 100%;}
.section-service .item-service .details .detail .top .name-wrap{padding-left: 70px;}
.section-service .item-service .details .detail .top .name-wrap .name{font-size: 24px;padding-top: 2px;}
.section-service .item-service .details .detail .top .name-wrap .subname{font-size: 14px;margin-top: 5px;}
.section-service .item-service .details .detail .description{font-size: 14px;line-height: 24px;margin-top: 30px;}
.section-service .bottom-img{width: 100%;}

/*evaluate*/
.section-evaluate{background: #f5f5f5;}
.section-evaluate .swiper-container-evaluate{width: 1200px;height: 600px;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper{}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide{background-size: cover;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context{color: #333;line-height: 30px;position: absolute;bottom: 25px;left: 30px;right: 30px;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context .word{font-size: 18px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;position: absolute;right: 0;bottom: 5px;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context .word:hover{color: #fde224;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context .fl{text-align: left;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context .fl .name{font-size: 24px;}
.section-evaluate .swiper-container-evaluate .swiper-wrapper .swiper-slide .context .fl .job{font-size: 14px;}

/*index-page-gether*/
.section-index-page-gether{padding-bottom: 0;}

/*companies*/
.block-companies{margin-bottom: 100px;}

/*design-idea*/
.block-design-idea{margin-bottom: 100px;}
.block-design-idea .swiper-container-design-idea{width: 1200px;height: 600px;}
.block-design-idea .swiper-container-design-idea .swiper-wrapper{}
.block-design-idea .swiper-container-design-idea .swiper-wrapper .swiper-slide{}

/*designers*/
.block-designers{}
.block-designers .swiper-container-designers{height: 495px;color: #333;}
.block-designers .swiper-container-designers .swiper-wrapper{}
.block-designers .swiper-container-designers .swiper-wrapper .swiper-slide{background: #f5f5f5;}

/*designer-base-info*/
.designer-base-info{height: 60px;}
.designer-base-info .avatar-wrap{width: 60px;height: 60px;overflow: hidden;border-radius: 50%;}
.designer-base-info .avatar-wrap img{height: 100%;display: block;margin: 0 auto;}
.designer-base-info .detail{padding-left: 20px;}
.designer-base-info .detail .top-part{height: 40px;line-height: 40px;}
.designer-base-info .detail .top-part .name{font-size: 24px;margin-right: 5px;}
.designer-base-info .detail .top-part .icon-star{margin-left: 3px;margin-top: -5px;width: 18px;}
.designer-base-info .detail .top-part .fr{font-size: 20px;}
.designer-base-info .detail .bottom-part{height: 20px;line-height: 20px;}
.designer-base-info .detail .bottom-part .tip{font-size: 14px;}
.designer-base-info .detail .bottom-part .tip .subtip{display: inline-block;height: 20px;line-height: 20px;background: #fff100;color: #1f2437;font-size: 12px;padding: 0 7px;border-radius: 10px;margin-right: 5px;}
.designer-base-info .detail .bottom-part .fr{font-size: 14px;}

/*designer-list*/
.block-designer-list{}
.block-designer-list .designer-level-wrap,.block-project-list .project-area-wrap{margin-bottom: 100px;}
.block-designer-list .designer-level-wrap:nth-last-child(1),.block-project-list .project-area-wrap:nth-last-child(1){margin-bottom: 0;}
.block-designer-list .title,.block-project-list .title{font-size: 32px;color: #333;}
.block-designer-list .subtitle{font-size: 18px;color: #333;line-height: 30px;margin: 30px 0 100px 0;}
.block-designer-list .desiger-wrap{height: 495px;background: #f5f5f5;margin-top: 40px;}

/*unit-designer*/
.unit-designer{width: 100%;height: 100%;}
.unit-designer .left-part{position: relative;width: 50%;height: 100%;padding: 30px;box-sizing: border-box;}
.unit-designer .left-part .designer-base-info{}
.unit-designer .left-part .tags{margin-top: 20px;}
.unit-designer .left-part .tags .tag{height: 28px;line-height: 28px;text-align: center;font-size: 14px;padding: 0 12px;border: 1px solid #333;border-radius: 14px;display: inline-block;margin-left: 10px;}
.unit-designer .left-part .tags .tag:nth-child(1){margin-left: 0;}
.unit-designer .left-part .subtitle{font-size: 18px;margin: 20px 0 10px 0;}
.unit-designer .left-part .detail{position: relative;font-size: 14px;line-height: 24px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.unit-designer .left-part .detail .more{position: absolute;right: 0;bottom: 0;height: 50%;line-height: 27px;background: #f5f5f5;padding-left: 20px;color: #333;cursor: pointer;font-size: 13px;}
.unit-designer .left-part .detail-pop{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0,0,0,0.85);z-index: -10;color: rgba(255,255,255,1);box-sizing: border-box;padding: 30px;display: flex;align-items: center;justify-content: center;line-height: 50px;}
.unit-designer .left-part .detail-pop .close-btn{position: absolute;width: 20px;height: 20px;right: 20px;top: 20px;width: auto;text-align: center;display: block;font-size: 20px;color: rgba(255,255,255,0.7);cursor: pointer;}
.unit-designer .left-part .detail-pop.actived{z-index: 200;opacity: 1;-webkit-opacity: 1;}
.unit-designer .left-part .income{height: 80px;background: #1F2437;margin-top: 20px;color: #fff;display: flex;align-items: center;justify-content: space-around;}
.unit-designer .left-part .income .item{font-size: 28px;text-align: center;}
.unit-designer .left-part .income .item span{display: block;font-size: 14px;}
.unit-designer .left-part .income .item .fr{margin-left: 6px;}
.unit-designer .left-part .income .item .fr .rank{background: #FDE224;padding: 0 4px;font-size: 14px;height: 30px;line-height: 30px;color: #1F2437;margin-top: 5px;}
.unit-designer .left-part .projects-completed{}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed{width: 100%;}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed .swiper-wrapper{}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed .swiper-wrapper .swiper-slide{width: auto;height: 40px;line-height: 40px;margin-left: 30px;display: inline-block;}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed .swiper-wrapper .swiper-slide:nth-child(1){margin-left: 0;}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed .swiper-wrapper .swiper-slide .img-wrap{width: 40px;height: 40px;float: left;font-size: 16px;margin-right: 10px;border-radius: 50%;overflow: hidden;}
.unit-designer .left-part .projects-completed .swiper-container-projects-completed .swiper-wrapper .swiper-slide .img-wrap img{height: 100%;display: block;margin: 0 auto;}
.unit-designer .right-part{width: 50%;height: 100%;}

/*banner-story*/
.section-banner-story{padding: 0;height: 100%;padding-top: 60px;background: rgba(45,45,45,0.95);}
.block-banner-story{height: 100%;}

/*activities*/
.section-activities{background: #f5f5f5;}
.section-activities .swiper-container-activities{width: 1200px;height: 600px;}
.section-activities .swiper-container-activities .swiper-wrapper{}
.section-activities .swiper-container-activities .swiper-wrapper .swiper-slide{background-size: cover;}

/*who are we*/
.block-who-are-we{margin-bottom: 100px;}
.block-who-are-we .numbers{width: 1200px;display: flex;align-items: center;justify-content: space-between;margin: 0 auto;margin-top: 60px;text-align: center;}
.block-who-are-we .numbers .item{text-align: center;}
.block-who-are-we .numbers .item:nth-child(1){min-width: 225px;}
.block-who-are-we .numbers .item:nth-child(2){min-width: 115px;}
.block-who-are-we .numbers .item:nth-child(3){min-width: 115px;}
.block-who-are-we .numbers .item:nth-child(1){min-width: 225px;}
.block-who-are-we .numbers .item .number{display: block;height: 122px;font-size: 100px;font-weight: bold;color: #000;}
.block-who-are-we .numbers .item .des{font-size: 24px;color: #666;display: block;}
.block-who-are-we > .title{font-size: 50px;color: #000;margin-top: 80px;}
.block-who-are-we .subtitle{font-size: 20px;color: #666;line-height: 40px;margin-top: 30px;}

/*core-team*/
.block-core-team{margin-bottom: 100px;}
.block-core-team .content{position: relative;}
.block-core-team .swiper-container{}
.block-core-team .swiper-container .swiper-wrapper{}
.block-core-team .swiper-container .swiper-wrapper .swiper-slide{}
.block-core-team .swiper-container .swiper-wrapper .swiper-slide .img-wrap{height: 340px;overflow: hidden;display: flex;align-items: center;justify-content: center;}
.block-core-team .swiper-container .swiper-wrapper .swiper-slide .img-wrap img{height: 100%;display: block;margin: 0 auto;}
.block-core-team .swiper-container .swiper-wrapper .swiper-slide .title{font-size: 24px;color: #000;margin-top: 15px;}
.block-core-team .swiper-container .swiper-wrapper .swiper-slide .subtitle{font-size: 18px;color: #666;margin-top: 8px;}

/*designers-cooperation*/
.block-designers-cooperation{}
.block-designers-cooperation .content{position: relative;}
.block-designers-cooperation .swiper-container{}
.block-designers-cooperation .swiper-container .swiper-wrapper{}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide{border: 1px solid #f5f5f5;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .img-wrap{height: 200px;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .img-wrap img{display: block;margin: 0 auto;width: 100%;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .designer-base-info{padding: 10px 0 10px 10px;background: #f5f5f5;height: 80px;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .designer-base-info .detail{padding-left: 75px;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .designer-base-info .detail .name{font-size: 22px;}
.block-designers-cooperation .swiper-container .swiper-wrapper .swiper-slide .designer-base-info .detail .bottom-part .tip{font-size: 13px;}

/*case-detail*/
.section-case-detail{padding: 0;}
.section-case-detail .block-case-detail{padding-bottom: 40px;}
.section-case-detail .block-case-detail p{margin: 0;}

/*unit-contact*/
.section-contact-us{background: #FFF548;}
.section-contact-us .input-wrap{height: 60px;display: block;margin: 0 auto;text-align: center;width: 770px;margin: 0 auto;}
.section-contact-us .input-wrap input{width: 615px;height: 100%;border: none;outline: none;float: left;font-size: 19px;color: #333;text-indent: 20px;}
.section-contact-us .input-wrap .btn-submit{width: 155px;height: 60px;line-height: 60px;background: #433904;color: #fff;font-size: 18px;text-align: center;display: inline-block;cursor: pointer;border-radius: 0;padding: 0;}

/*meetings*/
.section-meetings{overflow: visible;}
.block-meetings{}
.block-meetings .content{position: relative;}
.block-meetings .swiper-container-meetings-tab{height: 80px;line-height: 80px;text-align: center;color: #333;font-size: 20px;margin-bottom: 0;}
.block-meetings .swiper-container-meetings-tab .swiper-wrapper{}
.block-meetings .swiper-container-meetings-tab .swiper-wrapper .swiper-slide{color: #999;cursor: pointer;}
.block-meetings .swiper-container-meetings-tab .swiper-wrapper .swiper-slide.swiper-slide-thumb-active{color: #333;}
.block-meetings .swiper-container-meetings{height: 440px;color: #000;}
.block-meetings .swiper-container-meetings .swiper-wrapper{}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide{background: #f5f5f5;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fl{width: 320px;height: 100%;padding: 20px;box-sizing: border-box;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fl .title{font-size: 20px;color: #333;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fl .subtitle{font-size: 20px;color: #333;margin-top: 20px;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fl .qrcode-wrap{width: 205px;height: 205px;display: flex;align-items: center;justify-content: center;overflow: hidden;margin-top: 50px;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fl .qrcode-wrap img{display: block;margin: 0 auto;height: 100%;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fr{width: 880px;height: 100%;display: flex;align-items: center;justify-content: center;}
.block-meetings .swiper-container-meetings .swiper-wrapper .swiper-slide .fr img{display: block;margin: 0 auto;height: 100%;}

/*companies*/
.block-companies{}
.block-companies .content{position: relative;}
.block-companies .swiper-container{min-width: 470px;}
.block-companies .swiper-container .swiper-wrapper{}
.block-companies .swiper-container .swiper-wrapper .swiper-slide{height: 220px;display: flex;align-items: center;justify-content: center;border: 1px solid rgb(246,244,244);box-sizing: border-box;overflow: hidden;}
.block-companies .swiper-container .swiper-wrapper .swiper-slide img{display: block;margin: 0 auto;display: block;height: 100%;}

/*modal*/
.modal{padding: 0 !important;background: rgba(0,0,0,0.4);font-size: 16px;}
.modal-content{background: none;box-shadow: none;border: none;}
.modal-dialog{max-width: 590px;margin: 80px auto;}

.modal .item{padding: 30px;position: relative;width: 470px;background: #fff;display: block;margin: 0 auto;-webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);box-shadow: 0 5px 15px rgba(0,0,0,.5);border: 1px solid rgba(0,0,0,.2);}
.modal .item-long{width: 590px;}
.modal .close{position: absolute;right: 30px;top: 25px;outline: none;font-size: 30px;}
.modal .title-big{font-size: 36px;color: #333;font-weight: 700;margin-bottom: 30px;}
.modal .title-small{font-size: 16px;color: #333;}
.modal .title-small span{font-size: 14px;color: #666;}
.modal .title-small .symbol{color: #ff0000;font-size: 22px;float: left;margin-top: -4px;margin-right: 2px;height: 100%;}
.modal .btn-custom-next{height: 60px;background: #FFF548;font-size: 16px;color: #000;line-height: 60px;text-align: center;cursor: pointer;margin: 40px 0 10px 0;}
.modal .btn-custom-submit{width: 250px;height: 60px;background: #FFF548;font-size: 16px;color: #000;line-height: 60px;text-align: center;cursor: pointer;display: inline-block;}
.modal .btn-custom-pass{width: 250px;height: 60px;background: #f5f5f5;font-size: 16px;color: #000;line-height: 60px;text-align: center;cursor: pointer;display: inline-block;float: right;}
.modal input[type="text"]{background: #f5f5f5;border: 1px solid #e5e5e5;display: block;width: 100%;height: 60px;color: #333;outline: none;padding: 0 20px;margin: 20px 0;}
.modal#modal-demand input[type="text"]{margin: 30px 0;}
.modal .input-wrap{position: relative;}
.modal .input-wrap .symbol{position: absolute;color: #ff0000;top: 0;left: 20px;height: 100%;line-height: 60px;font-size: 22px;}
.modal .input-wrap input{padding-left: 30px;}
.modal .input-wrap .error-block-tel{display: none;position: absolute;width: 100%;height: 60px;left: 0;top: 0;text-align: right;line-height: 60px;color: #ff0000;padding-right: 20px;}
.modal .input-wrap .error-block-tel.actived{display: block;}
.modal#modal-demand textarea{height: 180px;background: #f5f5f5;border: 1px solid #e5e5e5;resize: none;width: 100%;margin: 20px 0 30px 0;outline: none;padding: 20px;}
.modal .upload-wrapper{margin-top: 12px;}
.modal .upload-wrapper .upload-btn{display: inline-block;min-width: 80px;height: 80px;background: #f5f5f5;color: rgb(54,54,54);text-align: center;line-height: 80px;font-size: 25px;cursor: pointer;overflow: hidden;}
.modal .upload-wrapper .upload-btn img{height: 100%;margin-top: -2px;}
.modal .item.item-ok{}
.modal .item.item-ok .icon-wrap{width: 120px;height: 120px;border-radius: 50%;background: #fde224;display: block;margin: 0 auto;line-height: 120px;text-align: center;margin-top: 20px;margin-bottom: 30px;font-size: 60px;}
.modal .item.item-ok .title-small{text-align: center;margin-bottom: 20px;}

.modal .project-container{margin-top: 30px;}
.modal .project-container .btn-add-project{display: inline-block;font-size: 14px;color: #fde224;cursor: pointer;margin: 20px 0 30px 0;}
.radio-container{margin: 20px 0;}
.radio-container.radio-container-area{margin-top: 10px;}
.radio-container.radio-container-direction{height: 60px;}
.radio-container .radio-wrapper{display: inline-block;margin-right: 35px;clear: both;}
.radio-container .radio-wrapper:nth-last-child(1){margin-right: 0;}
.radio-container .radio-wrapper label{font-weight: normal;color: #333;font-size: 16px;padding-left: 23px;margin-bottom: 0;}
.radio-container .radio-wrapper label:before{border: 1px solid #e5e5e5;width: 16px;height: 16px;top: 3px;}
.radio-container .radio-wrapper label:after{background: rgb(31,36,55);width: 10px;height: 10px;left: 3px;top: 6px;}
.radio-container .radio-wrapper input:checked + label:before{border: 1px solid rgb(31,36,55);}
.radio-container .option{float: left;width: 130px;height: 60px;line-height: 60px;border: 1px solid #e5e5e5;background: #f5f5f5;text-align: center;margin-right: 9px;cursor: pointer;position: relative;}
.radio-container .option:nth-last-child(1){margin-right: 0;}
.radio-container .option .icon-wrap{position: absolute;height: 100%;left: 10px;display: flex;align-items: center;justify-content: center;display: none;}
.radio-container .option .icon-wrap i{margin-top: 4px;color: #333;}
.radio-container .option:hover{background: rgba(255,245,72,0.5);}
.radio-container .option.actived{background: rgba(255,245,72,1);}
.radio-container .option.actived:hover{background: rgba(255,245,72,1);}
.radio-container .option.actived .icon-wrap{display: block;}
.radio-container-cases{position: absolute;left: 55px;height: 30px;}
.radio-container-cases .magic-radio + label:hover:before, .magic-checkbox + label:hover:before{animation: none;}
.radio-container-cases .radio-wrapper{display: block;margin: 0;margin-bottom: 15px;font-size: 18px;}
.radio-container-cases .radio-wrapper label{color: rgba(151,151,151,1);padding-left: 35px;}
.radio-container-cases .radio-wrapper label:before{width: 22px;height: 22px;border: 4px solid rgba(151,151,151,1) !important;top: 0;}
.radio-container-cases .radio-wrapper label:after{background: rgba(151,151,151,1);width: 8px;height: 8px;left: 7px;top: 7px;}
.radio-container-cases .radio-wrapper.green{}
.radio-container-cases .radio-wrapper.green label{color: rgba(88,174,187,1);}
.radio-container-cases .radio-wrapper.green label:before{border: 4px solid rgba(88,174,187,1) !important;}
.radio-container-cases .radio-wrapper.green label:after{background: rgba(88,174,187,1);}
.radio-container-cases .radio-wrapper.red{}
.radio-container-cases .radio-wrapper.red label{color: rgba(205,164,162,1);}
.radio-container-cases .radio-wrapper.red label:before{border: 4px solid rgba(205,164,162,1) !important;}
.radio-container-cases .radio-wrapper.red label:after{background: rgba(205,164,162,1);}
.radio-container-cases .radio-wrapper.orange{}
.radio-container-cases .radio-wrapper.orange label{color: rgba(218,199,166,1);}
.radio-container-cases .radio-wrapper.orange label:before{border: 4px solid rgba(218,199,166,1) !important;}
.radio-container-cases .radio-wrapper.orange label:after{background: rgba(218,199,166,1);}

/*cases 案例列表页 扇子 音效*/
.site-cases-page2-page{}
.site-cases-page2-page .container{width: 100%;height: 100%;padding: 0;position: relative;padding-top: 60px;}
.site-cases-page2-page .baraja-container{height: 100%;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.site-cases-page2-page .baraja-container ul.baraja-wrap{width: 200px;height: 310px;margin: 0 auto;position: relative;padding: 0;list-style-type: none;left: calc(-5%);top: calc(-7%);}
.site-cases-page2-page .baraja-container ul.baraja-wrap li{width: 100%;height: 100%;border-radius: 10px;padding: 5px;margin: 0;position: absolute;top: 0;left: 0;cursor: pointer;background: #fff;box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08);-webkit-user-select: none;user-select: none;-webkit-backface-visibility: hidden;backface-visibility: hidden;pointer-events: auto;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.actived{transition: all 0.3s !important;-webkit-transition: all 0.3s !important;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.actived:hover{top: -30px;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.init{opacity: 0;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .img-wrap{display: flex;align-items: center;justify-content: center;width: 100%;height: 125px;margin: 0 auto;border-radius: 10px 10px 0 0;overflow: hidden;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .img-wrap img{height: 100%;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.default{display: flex;align-items: center;justify-content: center;background: rgba(255,255,255);cursor: default;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.default .img-wrap{width: 100%;margin: 0 auto;height: auto !important;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li.default .img-wrap img{width: 80%;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .title{color: #555;font-size: 14px;padding: 8px 10px 5px;margin: 20px 3px 5px;border-bottom: 1px solid #f0f0f0;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .subtitle{font-size: 12px;padding: 0 10px;margin: 10px 3px 0;color: #777;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .symbol{position: absolute;width: 10px;height: 10px;border-radius: 50%;bottom: 5px;right: 5px;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .symbol.green{background: #58aebb;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .symbol.red{background: #cda4a2;}
.site-cases-page2-page .baraja-container ul.baraja-wrap li .symbol.orange{background: #dac7a6;}
.site-cases-page2-page .preview-container{position: absolute;width: 300px;height: calc(100% - 60px);right: 0;top: 60px;z-index: 2000;}
.site-cases-page2-page .preview-container .preview-wrapper{position: absolute;width: 100%;height: 100%;left: 0;top: 0;opacity: 0;-webkit-opacity: 0;}
.site-cases-page2-page .preview-container .preview-wrapper.actived{opacity: 1;-webkit-opacity: 1;}
.site-cases-page2-page .preview-container .preview-wrapper.green{background: rgba(88,174,187,1);}
.site-cases-page2-page .preview-container .preview-wrapper.red{background: rgba(205,164,162,1);}
.site-cases-page2-page .preview-container .preview-wrapper.orange{background: rgba(218,199,166,1);}
.site-cases-page2-page .preview-container .preview-wrapper .banner-wrap{height: 190px;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.site-cases-page2-page .preview-container .preview-wrapper .banner-wrap img{height: 100%;}
.site-cases-page2-page .preview-container .preview-wrapper .content{padding: 20px 20px 0 20px;color: #fff;}
.site-cases-page2-page .preview-container .preview-wrapper .content .title{font-size: 18px;}
.site-cases-page2-page .preview-container .preview-wrapper .content .subtitle{font-size: 15px;opacity: 0.6;margin-top: 5px;}
.site-cases-page2-page .preview-container .preview-wrapper .content .time{margin-top: 50px;font-size: 20px;font-size: 18px;height: 25px;line-height: 25px;}
.site-cases-page2-page .preview-container .preview-wrapper .content .time span{font-size: 16px;opacity: 0.6;float: right;}

/*cases 案例列表页 翻页效果*/
/*.site-cases-page{transition: none;-webkit-transition: none;background: #2E344F;}
.site-cases-page .project-container{width: 100%;height: 100%;padding: 0;position: relative;}
.site-cases-page .project-container .project-wrapper{height: 100%;width: 100%;position: absolute;top: 0;left: 0;display: none;}
.site-cases-page .project-container .project-wrapper .show{display: block;}
.site-cases-page .project-container .project-wrapper .project{position: absolute;width: 100%;height: 100%;background-position: center;background-repeat: no-repeat;background-size: cover;transition: none;-webkit-transition: none;}
.site-cases-page .project-container .project-wrapper .project:nth-child(1){z-index: 30;}
.site-cases-page .project-container .project-wrapper .project:nth-child(5n+1).actived{-webkit-mask: url(../images/nature-sprite.png);mask: url(../images/nature-sprite.png);-webkit-mask-size: 2300% 100%;mask-size: 2300% 100%;-webkit-animation: mask-play 1.4s steps(22) forwards;animation: mask-play 1.4s steps(22) forwards;}
.site-cases-page .project-container .project-wrapper .project:nth-child(5n+2).actived{-webkit-mask: url(../images/nature-sprite-2.png);mask: url(../images/nature-sprite-2.png);-webkit-mask-size: 7100% 100%;mask-size: 7100% 100%;-webkit-animation: mask-play 1.4s steps(70) forwards;animation: mask-play 1.4s steps(70) forwards;}
.site-cases-page .project-container .project-wrapper .project:nth-child(5n+3).actived{-webkit-mask: url(../images/urban-sprite.png);mask: url(../images/urban-sprite.png);-webkit-mask-size: 3000% 100%;mask-size: 3000% 100%;-webkit-animation: mask-play 1.4s steps(29) forwards;animation: mask-play 1.4s steps(29) forwards;}
.site-cases-page .project-container .project-wrapper .project:nth-child(5n+4).actived{-webkit-mask: url(../images/urban-sprite-2.png);mask: url(../images/urban-sprite-2.png);-webkit-mask-size: 7400% 100%;mask-size: 7400% 100%;-webkit-animation: mask-play 1.4s steps(73) forwards;animation: mask-play 1.4s steps(73) forwards;}
.site-cases-page .project-container .project-wrapper .project:nth-child(5n+5).actived{-webkit-mask: url(../images/building-sprite.png);mask: url(../images/building-sprite.png);-webkit-mask-size: 7500% 100%;mask-size: 7500% 100%;-webkit-animation: mask-play 1.4s steps(74) forwards;animation: mask-play 1.4s steps(74) forwards;}
.site-cases-page .loader-wrapper{transition: none;-webkit-transition: none;}
.site-cases-page .loader-wrapper .loader{transition: none;-webkit-transition: none;}
.site-cases-page .loader-wrapper .loader div{transition: none;-webkit-transition: none;width: 66px;height: 66px;line-height: 70px;font-size: 25px;background: #FFF548;color: #2E344F !important;}
.site-cases-page .loader-wrapper .loader div:after{background: #E5E5E5;bottom: -1.2em;}
.site-cases-page .loader-wrapper .loader div:nth-child(1){opacity: 1;-webkit-opacity: 1;}
.site-cases-page .loader-wrapper .loader div:nth-child(2){opacity: 0.86;-webkit-opacity: 0.9;}
.site-cases-page .loader-wrapper .loader div:nth-child(3){opacity: 0.72;-webkit-opacity: 0.8;}
.site-cases-page .loader-wrapper .loader div:nth-child(4){opacity: 0.58;-webkit-opacity: 0.7;}
.site-cases-page .loader-wrapper .loader div:nth-child(5){opacity: 0.44;-webkit-opacity: 0.6;}
.site-cases-page .loader-wrapper .loader div:nth-child(6){opacity: 0.3;-webkit-opacity: 0.5;}
.site-cases-page .loader-wrapper .loader div:nth-child(7){opacity: 0.16;-webkit-opacity: 0.4;}
.site-cases-page .project-container .project-wrapper .arrows{height: 100%;display: flex;align-items: center;justify-content: center;}
.site-cases-page .project-container .project-wrapper .arrows .arrow{position: absolute;width: 68px;height: 68px;line-height: 68px;text-align: center;border-radius: 50%;background: rgba(0,0,0,0.2);overflow: hidden;z-index: 200;}
.site-cases-page .project-container .project-wrapper .arrows .arrow:hover{background: rgba(0,0,0,0.6);}
.site-cases-page .project-container .project-wrapper .arrows .arrow.previous{left: 20px;}
.site-cases-page .project-container .project-wrapper .arrows .arrow.next{right: 32px;}
.site-cases-page .project-container .project-wrapper .arrows .arrow div{position: absolute;width: 100%;height: 100%;top: 0;left: 0;background-position: 50% 50%;background-repeat: no-repeat;background-size: 30px auto;cursor: pointer;}
.site-cases-page .project-container .project-wrapper .arrows .arrow.previous div{background-image: url(../images/arrow_left_white.png);}
.site-cases-page .project-container .project-wrapper .arrows .arrow.next div{background-image: url(../images/arrow_right_white.png);}
.site-cases-page .project-container .project-wrapper .pagination-custom{position: absolute;bottom: 20px;z-index: 34;width: 40%;left: 30%;display: flex;align-items: center;justify-content: center;}
.site-cases-page .project-container .project-wrapper .pagination-custom div{width: 10px;height: 10px;border-radius: 50%;background: rgba(255,255,255,0.5);margin: 6px;}
.site-cases-page .project-container .project-wrapper .pagination-custom div.actived{background: rgba(253,226,36,0.8);}*/

.site-cases-page{}
.site-cases-page .swiper-container-cases{position: absolute;width: 100%;height: 100%;left: 0;top: 0;}
.site-cases-page .swiper-container-cases .swiper-wrapper{}
.site-cases-page .swiper-container-cases .swiper-wrapper .swiper-slide{background-repeat: no-repeat;background-size: cover;background-position: 50% 50%;}
.site-cases-page .swiper-container-cases .swiper-wrapper .swiper-slide a{position: absolute;width: 100%;height: 100%;left: 0;top: 0;}
.site-cases-page .swiper-container-cases .swiper-pagination-cases{margin-bottom: 20px;}
.site-cases-page .swiper-container-cases .swiper-pagination-cases .swiper-pagination-bullet{width: 10px;height: 10px;}
.site-cases-page .swiper-container-cases .swiper-pagination-cases .swiper-pagination-bullet.swiper-pagination-bullet-active{background: #fde224;}
.site-cases-page .swiper-container-cases .swiper-button{}
.site-cases-page .swiper-container-cases .swiper-button div{background-color: rgba(0,0,0,0.2);opacity: 0.7;-webkit-opacity: 0.7;}
.site-cases-page .swiper-container-cases .swiper-button:hover div{background-color: rgba(0,0,0,0.4);opacity: 1;-webkit-opacity: 1;}
.site-cases-page .swiper-container-cases .swiper-button-prev-cases{left: 0;}
.site-cases-page .swiper-container-cases .swiper-button-prev-cases div{background-image: url(../images/arrow_left_white.png);}
.site-cases-page .swiper-container-cases .swiper-button-next-cases{right: 0;}
.site-cases-page .swiper-container-cases .swiper-button-next-cases div{background-image: url(../images/arrow_right_white.png);}


@keyframes mask-play{
    from{
        -webkit-mask-position: 0% 0;
        mask-position: 0% 0;
    }
    to{
        -webkit-mask-position: 100% 0;
        mask-position: 100% 0;
    }
}