/*------------------------第1P----------------------*/
.box_01{
    margin: 0 auto;
}
.box_01 .video{

    margin: 0 auto;
    position: relative; top:0%;
}
.box_01 .video video{
    height: 100%;
}
.box_01 .tex .btn a {
    background: url(../img/hero/zaoju/images/01/icon.png) no-repeat 95% center;
    padding-right: 20px;
    margin: 0 10px;
    color: #bc9882;
    font-size: 14px;
    position: relative;
    top: 50px;
    opacity: 0;
    transition: background-position 0.5s ease;
}
.box_01 .tex .btn a:hover{
    background-position: 100% center;
}
.box_01 .tex{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 300px;
    height: 100px;
    margin: -80px 0 0 -150px;
    color: #000;
    text-align: center;
}
.box_01 .tex h2{
    position: relative;
    opacity: 0;
    top: 50px;
}
.box_01 .tex span{
    display: inline-block;
    margin-bottom: 15px;
    font-size: 14px;
    position: relative;
    opacity: 0;
    top: 50px;
}

/*-------------------第3P-------------------*/
.box_03{
    box-shadow: -150px 0 150px #f8f4ea inset;
}
.box_03 .box_l {
    width: 50%; top:0px;
    height: 100%;
    float: left;
    height: 100%;
    background: #fff;
    position: relative;
    left: -20%;
    opacity: 0;
}
.box_03 .box_r h2{
    color: #000;
}
.box_03 .box_r h2 span{
    color: #000;
}
.box_03 .box_l img{
    display: none;
    max-width: 100%; position:absolute; left:0; bottom:0;
}
.box_03 .box_r .m_wrap{
    width: 380px;
    height: 590px;
    position: absolute;
    top: 50%;
    left: 45%;
    margin: -260px 0 0 -190px;
}
.box_03 .box_r{
    width: 50%;
    float: right;
    position: relative;
    height:100%;
}
.box_03 .box_r .model_01{
    text-align: center;
    width: 385px;
    background: url(../img/hero/zaoju/images/03/logo_03.png)no-repeat center top;
    background-size: 60px;
    padding-top: 75px;
    margin-bottom: 48px;
    position: relative;
    top: 50px;
    display: none;
}
.box_03 .box_r .model_01 .tex_01{
    margin-bottom: 10px;
}
.box_03 .box_r .model_01 .tex_02 p{
    line-height: 21px;
    font-size: 14px; color:#3c3c3c;
}
.box_03 .box_r .model_02{
    width: 303px;
    height: 300px;
    position: relative;
    top: 50px;
    display: none;
}
.box_03 .box_r .model_02 .btn li{
    position: absolute;
    font-size: 12px;  
    cursor: pointer;
}
.box_03 .box_r .model_02 p{
    /*background: url(../img/hero/zaoju/images/03/icon_02.png) no-repeat;*/
    position: absolute;
    bottom: -44px;
    left: 50%;
    margin: 10px 0 0 -96px;
    height: 40px;
    line-height: 40px;
    padding-left: 60px;
    font-size: 12px;
    background-size: 40px; color:#c38b61;
}
.box_03 .box_r .model_02 .btn .active{
    color: #c38b61;
    font-size: 14px;
}
.box_03 .box_r .model_02 .btn .on1{
    right: 205px;
    top: 0;
}
.box_03 .box_r .model_02 .btn .on2{
    right: 242px;
    top: 60px;
}
.box_03 .box_r .model_02 .btn .on3{
    right: 261px;
    top: 123px;
}
.box_03 .box_r .model_02 .btn .on4{
    right: 244px;
    top: 202px;
}
.box_03 .box_r .model_02 .btn .on5{
    right: 200px;
    top: 250px;
}
.box_03 .box_r .model_02 .btn .on6{
    right: 114px;
    top: 275px;
}
.box_03 .box_r .model_02 .btn .on7{
    right: 24px;
    top: 261px;
}
.box_03 .box_r .model_02 .tab img{
    display: none;
}
.box_03 .box_r .model_02 .tab{
    position: absolute;
    top: 15px;
    right: 0;
    z-index: -1;
}

.box_03 .box_r .model_02 .btn li i{ background:url(../img/hero/zaoju/images/03/icon.png) no-repeat; width:8px; height:10px; position:absolute; left:-15px; top:5px; display:none;}
.box_03 .box_r .model_02 .btn li.active i{-webkit-animation:la 0.8s ease-in infinite; animation:la 0.8s ease-in infinite; display:block;}
@keyframes la{
	0% {transform: translateX(0px);}
	50% {transform: translateX(5px);}
	100% {transform: translateX(0px);}
}
@-webkit-keyframes la{
	0% {-webkit-transform: translateX(0px);}
	50% {-webkit-transform:translateX(5px);}
	100% {-webkit-transform: translateX(0px);}
}


/*-------------------第2P-------------------*/
.page4{
    background: #bfab9f;
}
.box_04{
    width: 921px;
    height: 646px;
    position: absolute;
    left: 50%;
    margin-left: -408px;
    bottom: 112px;
}
.box_04 .info{
    color: #fff;
    font-size: 13px;
    text-align: center;
    z-index: 6;
    right: 30px;
    position: relative;
    top: -110px;
    width: 300px;
    height: 163px;
    left: 50%;
    margin-left: -188px;
}

.box_04 .info h2{
    color: #fff;
}
.box_04 .info p{
    font-size: 14px;
}
.box_04 .picbox .a1{
    width: 921px;
    height: 646px;
    position: absolute;
    left: 0;
    top: 78px;
    z-index: 3;
}
.box_04 .picbox .a2{
    width: 921px;
    height: 646px;
    position: absolute;
    left: 0;
    top: 192px;
    z-index: 4;
}
.box_04 .picbox .none{
    display: none;
}
.box_04 .picbox .c1{
    width: 921px;
    height: 646px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
}
.box_04 .picbox .c2{
    width: 921px;
    height: 646px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
}
.box_04 .picbox{
    width: 921px;
    height: 646px;
    position: relative;
    top: -200px;
    display: none;
    left: -31px;
}
.pad .picbox {
    left: -151px;
    top: 40px;
}
.pad .info{
    position: absolute;
    left: 54%;
    margin-left: 0;
    top: 39%;
}
.box_04 .xy{
    position: relative;
    top: 50px;
    opacity: 0;
}

/*-------------------第5P-------------------*/
.box_05 h2{
    color: #000;
    text-align: center;
}
.box_05 h2 span{
    color: #000;
}
.box_05{
    overflow: hidden;
}
.box_05 .wrap_l{
    width: 50%;
    height: 100%;
    float: left;
    position: relative;
}
.box_05 .info .tex_01 {
    background: url(../img/hero/zaoju/images/05/logo_05.png) top center no-repeat;
    background-size: 60px;
    padding-top: 70px;
}
.box_05 .wrap_l .info .tex_01{
    margin-bottom: 15px;
    position: relative;
    top: 50px;
    opacity: 0;
}
.box_05 .info .tex_02{
    overflow: hidden;
    position: relative;
    top: 50px;
    opacity: 0;
}
.box_05 .wrap_r{
    width: 50%;
    height: 100%;
    float: right;
    position: relative;
    left: 200px;
    opacity: 0;
}
.box_05 .wrap_r img{
    display: none;
    width: 100%;
    z-index: 10;
    position: relative;
}
.box_05 .wrap_r .tex span{ cursor:pointer;}
.box_05 .wrap_r .tex span i{  font-style:normal; margin-left:20px; }
.box_05 .wrap_r .tex span.on i{margin-left:0px;}
.box_05 .wrap_r .tex span.on{ color:#bc9882;}
.box_05 .wrap_r .tex .p1{
    position: absolute;
    top: 50%;
    left: -108px;
    font-size:14px;
}
.box_05 .wrap_r .tex .p2{
    position: absolute;
    top: 54%;
    left: -133px;
     font-size:14px;
}
.box_05 .info{
    width: 237px;
    height: 352px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -176px 0 0 -142px;
}

.box_05 .info .tex_02 ul{
    display: block;
    float: left;
    width: 50%;
}
.box_05 .info .tex_02 ul li{
    background: url(../img/hero/zaoju/images/05/icon_dian.png) no-repeat;
    background-position: center left;
    padding-left: 10px;
    text-align: left;
    display: block;
    font-size: 13px;
    
    line-height: 21px;
	margin-bottom:4px;
}
.box_05 .info .tex_02 ul li.shou{cursor: pointer; color:#bc9882;}
/*-------------------第6P-----------------------*/
.box_06{
    position: relative;
    text-align: center;
}
.box_06 .tex img{
    margin-bottom: 15px;
}
.box_06 .tex{
    width: 400px;
    position: absolute;
    top: 50%;
    right: 15%;
    font-size: 13px;
    
    
}
.box_06 .tex h2{
	background: url(../img/hero/zaoju/images/06/logo_06.png) top center no-repeat;
    background-size: 60px;
    padding-top: 70px;
	width:400px;
}
.box_06 .tex p{ color:#3c3c3c; line-height:21px;}
.box_06 .k1{
    width: 500px;
    height: 500px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -250px 0 0 -250px;
    opacity: 0; font-size:14px; color:#3c3c3c;
}
.box_06 .k1 .img{ position:absolute; left:0; top:0; display:none; opacity:1;}

/*入场逐渐*/
.an{transform: translate(0px,50px); -webkit-transform: translate(0px,50px); opacity:0;}
@keyframes jin{
	0% {transform: translate(0px,50px);opacity:0;}
	100% {transform:translate(0,0);opacity:1;}
}
@-webkit-keyframes jin{
	0% {-webkit-transform: translate(0px,50px);opacity:0;}
	100% {-webkit-transform:translate(0,0);opacity:1;}
}

.b6_dh1 h2,.b6_dh2 p
{-webkit-animation:jin 0.5s linear; animation:jin 0.5s linear; transform:translate(0,0); -webkit-transform:translate(0,0); opacity:1;}



/*小屏幕自适应*/
.w1366h768 .box_01 .video{ width:85%; top:0%;}
.box_01 .tex{ top:55%;}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section {
	display:block
}

.cd-image-container {
	position: absolute;
	width:100%;
	margin:0 auto; left:0; bottom:0;
}
.cd-image-container video {
	display:block
}
.cd-image-label {
	position:absolute;
	bottom:0;
	right:0;
	color:#fff;
	padding:1em;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	opacity:0;
	-webkit-transform:translateY(20px);
	-moz-transform:translateY(20px);
	-ms-transform:translateY(20px);
	-o-transform:translateY(20px);
	transform:translateY(20px);
 -webkit-transition:-webkit-transform .3s .7s, opacity .3s .7s;
 -moz-transition:-moz-transform .3s .7s, opacity .3s .7s;
 transition:transform .3s .7s, opacity .3s .7s
}
.cd-image-label.is-hidden {
	visibility:hidden
}
.is-visible .cd-image-label {
	opacity:1;
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
	transform:translateY(0)
}
.cd-resize-img {
	position:absolute;
	top:0;
	left:0;
	width:0;
	height:100%;
	overflow:hidden;
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-ms-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
.cd-resize-img video {
	position:absolute;
	left:0;
	top:0;
	display:block;
	height:100%;
	width:auto;
	max-width:none
}
.cd-resize-img .cd-image-label {
	right:auto;
	left:0
}
.is-visible .cd-resize-img {
	width:50%;
 -webkit-animation:cd-bounce-in .7s;
 -moz-animation:cd-bounce-in .7s;
 animation:cd-bounce-in .7s
}
@-webkit-keyframes cd-bounce-in {
 0% {
 width:0
}
60% {
 width:55%
}
100% {
 width:50%
}
}
@-moz-keyframes cd-bounce-in {
 0% {
 width:0
}
60% {
 width:55%
}
100% {
 width:50%
}
}
@keyframes cd-bounce-in {
 0% {
 width:0
}
60% {
 width:55%
}
100% {
 width:50%
}
}
.cd-handle {
	position:absolute;
	height:44px;
	width:44px;
	left:50%;
	top:50%;
	margin-left:-22px;
	margin-top:-22px;
	border-radius:50%;
	
	cursor:move;
	box-shadow:0 0 0 6px rgba(0, 0, 0, .2), 0 0 10px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .3);
	opacity:0;
	-webkit-transform:translate3d(0, 0, 0) scale(0);
	-moz-transform:translate3d(0, 0, 0) scale(0);
	-ms-transform:translate3d(0, 0, 0) scale(0);
	-o-transform:translate3d(0, 0, 0) scale(0);
	transform:translate3d(0, 0, 0) scale(0)
}
.cd-handle .img2{ position:absolute; left:0; top:0; width:100%; height:100%; background: url(../../images/btn.png) no-repeat; z-index:9;}
.cd-handle span{width:88px; height:88px; position:absolute; left:0; top:0; border-radius:100%; background:#be9b85; opacity:0.3; display:block;}
@keyframes bowen{
	0% {transform: scale(1); opacity:.3;}
	100% {transform:scale(5); opacity:0;}
}
@-webkit-keyframes bowen{
	0% {-webkit-transform: scale(1); opacity:.3;}
	100% {-webkit-transform:scale(5); opacity:0;}
}
.cd-handle span{-webkit-animation:bowen 1.8s ease-in infinite; animation:bowen 1.8s ease-in infinite;}
.cd-handle span.n2{animation-delay:0.6s; -webkit-animation-delay:0.6s;}
.cd-handle span.n3{animation-delay:1.2s; -webkit-animation-delay:1.2s;}
.cd-handle.draggable span{ display:none;}




.cd-handle.draggable {
	background-color:#445b7c
}
.is-visible .cd-handle {
	opacity:1;
	-webkit-transform:translate3d(0, 0, 0) scale(1);
	-moz-transform:translate3d(0, 0, 0) scale(1);
	-ms-transform:translate3d(0, 0, 0) scale(1);
	-o-transform:translate3d(0, 0, 0) scale(1);
	transform:translate3d(0, 0, 0) scale(1);
 -webkit-transition:-webkit-transform .3s .7s, opacity 0s .7s;
 -moz-transition:-moz-transform .3s .7s, opacity 0s .7s;
 transition:transform .3s .7s, opacity 0s .7s
}
.is-visible .cd-resize-img {
    /*border-right:1px solid #ccc;*/
	border-right:1px solid #2D2927;
}
/*.cd-resize-line {
    width: 1px;
    height: 100%;
    background-color: #ccc;
    background-color: red;
    position: absolute;
    right: 0;
    z-index: 999;
}*/
.cd-resize-img .cd-image-label {
	color:#333;
	right:100px;
}
.is-visible .cd-handle {
	
	width:88px;
	height:88px;
	margin-left:-44px;
	margin-top:-44px;
	box-shadow:none;
}
.cd-image-container .left {
	display:none;
	position:absolute;
	left:0;
	top:0;
}
.cd-image-container .right {
	display:none;
	position:absolute;
	left:0;
	top:0;
}
.cd-image-container .left {
	position: absolute;
	left:0%;
	top:0;
	height:100%;
	z-index:99;
	width:100%;
	display:none;
}
.cd-image-container .left .txt {
	width:332px;
	height:150px;
	position:absolute;
	left:50%;
	top:45%;
	margin-left:60px;
	margin-top:-75px;
	background:url(../../images/t1.png) no-repeat;
}
.cd-image-container .left .txt p {
	text-align:center;
	margin-top:120px;
	font-size:14px;
	line-height:21px;
	color:#3c3c3c;
}
.cd-image-container .right {
	position: absolute;
	right:0%;
	top:0;
	height:100%;
	width:100%;
	z-index:99;
	display:none;
}
.cd-image-container .right .txt {
	width:332px;
	height:150px;
	position:absolute;

	left:50%;
	top:45%;
	margin-left:-390px;
	margin-top:-75px;
	background:url(../../images/t2.png) no-repeat;
}
.cd-image-container .right .txt p {
	text-align:center;
	margin-top:120px;
	font-size:12px;
	line-height:21px;
	color:#3c3c3c;
}
.cd-handle {
	z-index:999;
}
.txt_left {
	background: url(../../images/txt_1.png) no-repeat;
	width:156px;
	height:38px;
	position:absolute;
	left:-178px; 
	top:26px;
}
.txt_right {
	background: url(../../images/txt_2.png) no-repeat;
	width:156px;
	height:38px;
	position:absolute;
	left:108px;
	top:26px;
}


.w1366h768 .box_04{ margin-bottom:-50px;}
.cd-image-container,.cd-handle{ *display:none;}