.main{display:none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
/*首页模块*/
.home{position:absolute;top:0;left:0;right:0;bottom:160px;box-sizing: border-box;text-align: center;}
.home_idea{position:relative;height:100%;padding-top: 30px;box-sizing:border-box;font-size: 0;}
.home_idea:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.home_idea img{position:relative;vertical-align:middle;height:328px;margin: 0 23px;}
.home_idea img:last-child{margin: 0 12px;}
/*.home_idea img:nth-child(1){top:100px;}
.home_idea img:nth-child(2){top:-100px;}
.home_idea img:nth-child(3){top:100px;}
.home_idea img:nth-child(4){top:-100px;}*/
.home_idea img:nth-child(1){-webkit-animation: first 2s ease;}
.home_idea img:nth-child(2){-webkit-animation: second 2s ease;}
.home_idea img:nth-child(3){-webkit-animation: three 2s ease;}
.home_idea img:nth-child(4){-webkit-animation: four 2s ease;}
.home_word{position: absolute;top: 30px;bottom:0;left: 0;right:0;font-size: 0;}
.home_word:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.home_word cite{display: inline-block;vertical-align: middle;}
.home_word img{position:relative;vertical-align: middle;margin: 0 5px;transform-origin:0% 0%;-webkit-animation: visiable 2s linear 0s infinite;}
.home_word img:nth-child(1){-webkit-animation: rotate1 2.1s ease 0s;}
.home_word img:nth-child(2){-webkit-animation: rotate2 2.2s ease 0s;}
.home_word img:nth-child(3){-webkit-animation: rotate3 2.3s ease 0s;}
.home_word img:nth-child(4){-webkit-animation: rotate4 2.4s ease 0s;}
.home_word img:nth-child(5){-webkit-animation: rotate5 2.5s ease 0s;}
.home_word img:nth-child(6){-webkit-animation: rotate6 2.6s ease 0s;}
.home_word img:nth-child(7){-webkit-animation: rotate7 2.7s ease 0s;}
.home_word img:nth-child(8){-webkit-animation: rotate8 2.8s ease 0s;}
.home_word img:nth-child(9){-webkit-animation: rotate9 2.9s ease 0s;}
.home_word img.turn{margin-top: 24px;-webkit-animation: rotate10 3.5s ease 0s;}
@media only screen and (min-width: 1100px) and (max-width: 1200px) {.home_idea img{height: 290px;}}
@media only screen and (min-width: 1000px) and (max-width: 1100px) {.home_idea img{height: 250px;}}
@media only screen and (min-width: 800px) and (max-width: 1000px) {.home_idea img{height: 200px;}}

@keyframes first{
	0%{top:300px;opacity: 0;transform: rotateY(180deg);}
	75%{top:0;opacity: 1;transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
}
@-webkit-keyframes second{
	0%{top:-300px;opacity: 0;transform: rotateY(180deg);}
	75%{top:0;opacity: 1;transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
	
}
@keyframes three{
	0%{top:300px;opacity: 0;transform: rotateY(180deg);}
	75%{top:0;opacity: 1;transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
}
@-webkit-keyframes four{
	0%{transform:rotateX(180deg) scale(0);}
	75%{transform:rotateX(180deg) scale(1);}
	100%{transform: rotateX(0deg);}
}
@keyframes rotate1{
	0%{opacity: 0;}
	95.238%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate2{
	0%{opacity: 0;}
	95.4545%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate3{
	0%{opacity: 0;}
	95.6521%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate4{
	0%{opacity: 0;}
	95.8333%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate5{
	0%{opacity: 0;}
	96%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate6{
	0%{opacity: 0;}
	96.1538%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate7{
	0%{opacity: 0;}
	96.29629%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate8{
	0%{opacity: 0;}
	96.42857%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate9{
	0%{opacity: 0;}
	96.55172%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
@keyframes rotate10{
	0%{opacity: 0;}
	88%{opacity: 0;transform: rotateY(90deg);}
	100%{opacity: 1;transform: rotateY(0deg);}
}
/*案例列表*/
.case{display: none;position:absolute;top:0;left:0;right:0;bottom:160px;box-sizing: border-box;text-align: center;font-size:0;-webkit-animation: visiable 1s ease 0s;}
.case:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.case_list{position:relative;display:inline-block;vertical-align:middle;width: 62.5%;}
.case_list_content{position: relative;overflow: hidden;white-space: nowrap;margin: 0 -10px;}
.case_list_content ul{font-size: 0;margin: 0 -20px;}
.case_list_content li{display: inline-block;width: 25%;}
.case_list_content li a{display: block;margin: 20px 20px;}
.case_list_content li a label{position:relative;display: block;padding-bottom: 111.11%;overflow: hidden;cursor: pointer;background: #e6e6e6;}
.case_list_content li a label span{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.case_list_content li a label span img{width: 100%;height: 100%;vertical-align: middle;}
.case_list_content li a label em{position: absolute;top: 100%;left: 0;width: 100%;height: 100%;padding: 0 10px;box-sizing: border-box;text-align:center;background: #222222;transition: all 0.3s;}
.case_list_content li a label em:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.case_list_content li a label em cite{display: inline-block;vertical-align: middle;}
.case_list_content li a label em cite img{max-height: 100%;max-width: 100%;}
.case_list_content li a label em cite strong{display:block;margin-top:24px;font-size: 20px;color: #fff;}
.case_list_content li a label:hover em{top: 0;}

.case_option{position:relative;white-space: normal;display: inline-block;width: calc(100% - 20px); margin: 0 10px;left: 0;transition: all 0.5s;}


.case_list_nav{position: absolute;left:0;bottom: -20px;width: 100%;height: 10px;}
.case_list_nav ul{font-size: 0;}
.case_list_nav li{display: inline-block;width: 10px;height: 10px;margin:0 12px;border-radius: 100%;background: #cccccc;cursor: pointer;}
.case_list_nav li.active{background: #ff6528;}
.prev_btn{position: absolute;top: 50%;left:-140px;width:80px;height:180px;margin-top:-90px;cursor: pointer;}
.prev_btn:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.prev_btn img{width: 43px;vertical-align: middle;}
.prev_btn:hover{background: #e5e5e5;}
.next_btn{position: absolute;top: 50%;right:-140px;width:80px;height:180px;margin-top:-90px;cursor: pointer;}
.next_btn:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.next_btn img{width: 43px;vertical-align: middle;}
.next_btn:hover{background: #e5e5e5;}

@media screen and (min-width: 1921px){.case_list_content ul{margin: 0 -10px;}.case_list_content li a{margin: 10px;}.case_list_content li{width: 16.66%;}}
@media screen and (min-width: 1000px) and (max-width: 1700px) {.case_list_content ul{margin: 0 -10px;}.case_list_content li a{margin: 10px;}}
@media screen and (max-width: 1000px) {.case_list_content li{width: 33.33%;}.case_list_content ul{margin: 0 -10px;}.case_list_content li a{margin: 10px;}}

/*关于我们*/
.about{display: none;position:absolute;top:0;left:0;right:0;bottom:160px;box-sizing: border-box;text-align: center;-webkit-animation: visiable 1s ease 0s;}
.about:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.about_content{position:relative;display:inline-block;vertical-align:middle;width: 62.5%;text-align: left;}
.about_content_visual{float:left;display:inline-block;width: 50%;}
.about_content_visual img:first-child{height: 29px;}
.about_content_visual p{margin-top:30px;font-size: 14px;color: #666;line-height: 25px;}
.about_content_company{float: left;width: 35%;margin-left:15%;font-size: 0;;}
.about_content_company img{height: 29px;}
.about_content_company p{position:relative;margin-top:36px;padding-left:100px;font-size: 14px;color: #666;line-height: 18px;}
.about_content_company p strong{position:absolute;top:0;left:0;margin-right:10px;font-size: 18px;color: #333;}
.about_content_deliver{float:left;width:100%;margin-top: 100px;}
.about_content_deliver img:first-child{height: 30px;}
.about_content_deliver ul{font-size: 0;margin: 40px -20px 0;}
.about_content_deliver li{display:inline-block;width: 16.66%;}
.about_content_deliver li a{display: block;margin: 0 20px;text-align: center;}
.about_content_deliver li a strong{font-size: 18px;color: #333;line-height: 30px;}
.about_content_deliver li a p{font-size: 14px;color: #666;line-height: 24px;}
.about_content_deliver li a img{margin-top: 30px;}

@media only screen and (min-width: 1480px) and (max-width: 1700px) {.about_content_company{width: 40%;margin-left: 10%;}}
@media only screen and (min-width: 1250px) and (max-width: 1480px) {.about_content{width: 70%;}.about_content_company{width: 42%;margin-left: 8%;}}
@media only screen and (min-width: 500px) and (max-width: 1250px){.about_content{width:80%;}.about_content_company{width: 45%;margin-left: 5%;}}

@media screen and (min-width: 1300px) and (max-width: 1440px){.about_content_deliver li a img{margin-top: 15px;}}
@media screen and (min-width: 1000px) and (max-width: 1300px){.about_content_deliver li a img{margin-top: 10px;}.about_content_deliver{margin-top: 60px;}.about_content_deliver li a{margin: 0 10px;}}
@media screen and (min-width: 700px) and (max-width: 1000px){.about_content_deliver li a img{margin-top: 10px;}.about_content_deliver{margin-top: 30px;}.about_content_deliver li a{margin: 0 5px;}.about_content_deliver ul{margin-top: 20px;}}

/*联系我们*/
.contact{display: none;position:absolute;top:0;left:0;right:0;bottom:160px;box-sizing: border-box;text-align:center;overflow: hidden;-webkit-animation: visiable 1s ease 0s;}
.contact:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.contact_content{position:relative;display:inline-block;vertical-align:middle;width: 50%;font-size: 0;}
.contact_content_negotiate{float: left;display: inline-block;width: 50%;text-align: left;}
.contact_content_negotiate img{margin-bottom: 12px;}
.contact_content_negotiate p{position:relative;margin: 30px 0;padding-left: 75px;font-size: 14px;color: #666;line-height: 18px;}
.contact_content_negotiate p label{position: absolute;left: 0;top: 0;line-height: 18px;white-space: nowrap;}
.contact_content_negotiate p:hover{color: #ff6528;}
.contact_content_negotiate p:hover label{color: #666;}
.contact_content_message{float: left;display: inline-block;width: 50%;min-width:400px;text-align: right;}
.contact_content_message label{display: inline-block;width:400px;text-align: left;padding-bottom: 20px;}
.contact_content_message cite{position:relative;display: inline-block;width: 400px;height: 40px;margin:10px 0;padding-left:80px;box-sizing:border-box;white-space: nowrap;}
.contact_content_message cite span{position:absolute;top:0;left:0;display:inline-block;width:80px;font-size: 14px;color: #999;line-height: 40px;text-align:right;white-space: nowrap;}
.contact_content_message cite input{position:absolute;top:0;left:0;display: inline-block;width: 100%;height: 100%;padding-left: 90px;box-sizing:border-box;border: 1px solid #999999;font-size: 14px;color: #333;background: transparent;}
.contact_content_message p{position:relative;display: inline-block;width: 400px;height: 120px;margin:10px 0;padding-left:80px;box-sizing:border-box;}
.contact_content_message p span{position:absolute;top:0;left:0;display:inline-block;width:80px;font-size: 14px;color: #999;line-height: 40px;text-align:right;white-space: nowrap;}
.contact_content_message p textarea{position: absolute;top: 0;left: 0;display: inline-block;width: 100%;height: 100%;padding:10px 10px 10px 90px;box-sizing:border-box;border: 1px solid #999999;font-size: 14px;color: #333333;line-height: 20px;text-align: left;background: transparent;}
.contact_content_message input[type=submit]{position:relative;display: inline-block;width: 400px;height: 40px;margin-top:10px;box-sizing:border-box;border: 1px solid #999999;text-align: center;font-size: 14px;color: #999;line-height: 40px;cursor: pointer;background: transparent;}
.contact_content_message input[type=submit]:hover{color: #ff6528;border-color: #ff6528;}
.contact_content_message input:focus{border-color: #ff6528;}
.contact_content_message textarea:focus{border-color: #ff6528;}
.contact_content_message cite:hover input{border-color: #ff6528;}
.contact_content_message p:hover textarea{border-color: #ff6528;}
.contact_logs{float:left;margin-top: 60px;width: 100%;text-align: left;}
.contact_logs ul{font-size: 0;margin: 0 -20px;}
.contact_logs li{display: inline-block;}
.contact_logs li a{display: inline-block;margin:20px;}
.contact_logs li a img:nth-child(2){display: none;}
.contact_logs li a:hover img:nth-child(1){display: none;}
.contact_logs li a:hover img:nth-child(2){display: inline;}

@media screen and (min-width: 1500px) and (max-width: 1700px) {.contact_content{width: 60%;}}
@media screen and (min-width: 1250px) and (max-width: 1500px) {.contact_content{width: 65%;}}
@media screen and (min-width: 1080px) and (max-width: 1250px) {.contact_content{width: 75%;}.contact_logs{margin-top: 30px;}}
@media screen and (min-width: 1000px) and (max-width: 1080px) {.contact_content{width: 80%;}.contact_logs{margin-top: 20px;}}
@media screen and (max-width: 1000px) {.contact_content{width: 80%;}.contact_logs{margin-top: 20px;}}

/*底部栏*/
.footer{position: fixed;bottom:0;left:0;width:100%;height: 160px;text-align:center;}
.footer ul{font-size: 0;}
.footer li{position:relative;display: inline-block;height: 80px;margin:0 45px;white-space: nowrap;}
.footer li:first-child{width: 88px;}
.footer li img{height: 100%;-webkit-animation: rotateX 4.2s ease 0s;}
.footer li img:hover{-webkit-animation: turn 4s ease 0s infinite alternate;}
.footer li a{display: block;height: 100%;}
.footer li a:before{content: "";display: inline-block;vertical-align: middle;width:0;height:100%;}
.footer li span{display:inline-block;vertical-align:middle;padding:0 8px;font-size:18px;color:#333;line-height:36px;cursor: pointer;}
.footer li.active span{color: #ff6528;border-bottom: 2px solid #ff6528;}
.footer li:hover span{color: #ff6528;}
.footer p{margin-top:45px;font-size: 14px;line-height: 14px;}

@media only screen and (min-width: 900px) and (max-width: 1100px) {.footer li{margin: 0 30px;}}
@media only screen and (min-width: 700px) and (max-width: 900px) {.footer li{margin: 0 15px;}}

.footer li:nth-child(1){-webkit-animation: rise1 0.8s ease 0s;}
.footer li:nth-child(2){-webkit-animation: rise2 1s ease 0s;}
.footer li:nth-child(4){-webkit-animation: rise4 1.2s ease 0s;}
.footer li:nth-child(5){-webkit-animation: rise5 1.4s ease 0s;}

@keyframes turn{
	0%{transform: rotateX(0deg) rotateY(0deg) rotateZ(90deg);}
	5%{transform: rotateX(0deg) rotateY(0deg) rotateZ(180deg);}
	10%{transform: rotateX(0deg) rotateY(0deg) rotateZ(270deg);}
	15%{transform: rotateX(0deg) rotateY(0deg) rotateZ(360deg);}
	20%{transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
	25%{transform: rotateX(450deg) rotateY(45deg) rotateZ(180deg);}
	50%{transform: rotateX(360deg) rotateY(180deg);}
	100%{transform: rotateX(180deg) rotateY(360deg);}
}

@keyframes rise1{
	0%{opacity: 0;top: 50px;}
	100%{opacity: 1;top: 0px;}
}
@keyframes rise2{
	0%{opacity: 0;top: 50px;}
	20%{opacity: 0;top: 50px;}
	100%{opacity: 1;top: 0px;}
}
@keyframes rise4{
	0%{opacity: 0;top: 50px;}
	33.33%{opacity: 0;top: 50px;}
	100%{opacity: 1;top: 0px;}
}
@keyframes rise5{
	0%{opacity: 0;top: 50px;}
	42.85%{opacity: 0;top:50px;}
	100%{opacity: 1;top: 0px;}
}

/*案例详情*/
.detail{display:none;position: fixed;top:0;left:0;width:100%;height:100%;padding-right: 500px;box-sizing: border-box;background: #fff;-webkit-animation: visiable 0.3s ease 0s;}
.detail_content{position: relative;height: 100%;overflow-x: hidden;overflow-y: scroll;}
.detail_content ul{position:relative;font-size: 0;white-space: nowrap;left:0;transition: all 0.5s;}
.detail_content li{display: inline-block;width: 100%;height: 100%;}
.detail_content li img{width: 100%;}
.detail_describe{position: absolute;right: 0;top: 0;width: 500px;height: 100%;}
.detail_describe_btn{position:relative;height: 240px;border-bottom: 1px solid #e6e6e6;}
.detail_describe_btn span{position: absolute;right: 0;top: 0;width:56px;height:56px;padding: 20px 20px 0 0;box-sizing: border-box;cursor: pointer;}
.detail_describe_btn span img{width: 100%;height: 100%;}
.detail_describe_btn cite{position: absolute;bottom: 0;left: 0;width:100%;height: 60px;font-size: 0;}
.detail_describe_btn cite a{display: inline-block;width: 50%;height: 100%;padding-left:40px;box-sizing: border-box;}
.detail_describe_btn cite a:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.detail_describe_btn cite a img{vertical-align: middle;}
.detail_describe_btn cite a img:nth-child(2){display: none;}
.detail_describe_btn cite a.prev_case{padding-left: 40px;}
.detail_describe_btn cite a.next_case{padding-right: 40px;text-align: right;}
.detail_describe_btn cite a:hover{background: #ff6528;}
.detail_describe_btn cite a:hover img:nth-child(1){display: none;}
.detail_describe_btn cite a:hover img:nth-child(2){display: inline;}
.detail_describe_content{position: relative;padding: 80px 40px 0;}
.detail_describe_content strong{font-size: 30px;color: #333;}
.detail_describe_content span{position:relative;display: block;font-size:14px;color:#999;line-height:24px;margin-top:6px;white-space: nowrap;}
.detail_describe_content span:before{content: "";position:absolute;bottom:-10px;left:0;display: inline-block;width: 40px;height: 2px;background: #ff6528;}
.detail_describe_content p{margin-top: 35px;font-size: 14px;line-height:28px;color: #666;}

@media screen and (max-width: 1440px) {.detail{padding-right: 400px;}.detail_describe{width: 400px;}}
@media screen and (max-width: 1200px) {.detail{padding-right: 350px;}.detail_describe{width: 350px;}}

/*进场动画*/
.going{position: fixed;top: 0;left: 0;width:100%;height:100%;font-size: 0;text-align: center;}
.going:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.going img{vertical-align: middle;}
.going span{position:absolute;top:80%;left:50%;margin-left: -35%; display: inline-block;width: 70%;height: 1px;background: #f00;-webkit-animation: going 1.5s ease 0s;}

@keyframes rotateX{
	0%{transform: rotateX(90deg);}
	100%{transform: rotateX(0deg);}
}

@keyframes going{
	0%{width: 0;display: block;}
	100%{width: 70%;display: none;}
}

.loading{display:none;position:absolute;top: 0;left: 0;right: 0;bottom: 0;text-align: center;background: rgba(0,0,0,0.3);}
.loading:before{content: "";display: inline-block;vertical-align: middle;width: 0;height: 100%;}
.loading cite{display: inline-block;vertical-align: middle;}
.loading cite span{display:inline-block;font-size: 15px;color: #fff;}