@charset "utf-8";
*{margin:0;padding: 0;}
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img {margin: 0; padding: 0; } 
fieldset, img {border: none; }
img{vertical-align:top; display:inline-block}
ul, ol {list-style: none; }
input {padding-top: 0; padding-bottom: 0; font-family: "SimSun", "宋体"; }
select, input {vertical-align: middle; }
select, input, textarea {font-size: 12px; margin: 0; }
textarea {resize: none; }
table {border-collapse: collapse; }
body {font: 21px '微软雅黑'; color:#000}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,h1,h2,h3 ,h4 ,h5 ,h6{font-weight:normal; }
i,em{font-style: normal;}
a {color: #fff; text-decoration: none; }
.fl{ float:left;}
.fr{ float:right;}
.fix:after{ clear:both; content:"."; height:0px; display:block; overflow:hidden; visibility:hidden }
.fix{*zoom:1;}
.clearfix:after{ clear:both; content:"."; height:0px; display:block; overflow:hidden; visibility:hidden }
.clearfix{*zoom:1;}

.hs{ color:#fff600; font-weight:700}
.mr30{ margin-right:30px}

.dot-bottom {
    width: 0;
    height: 0;
    border-top: 15px solid #00a000;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
}  
.dot-left {
    width: 0;
    height: 0;
    border-left: 15px solid #47abc3;
    border-bottom: 15px solid transparent;
    border-top: 15px solid transparent;
} 

.wrap{
	max-width: 1680px;
	min-width: 1200px;
	margin:0 auto;
}
.btncon{ width:100%; text-align:center; box-sizing:border-box; padding:50px 0}
.btncon .btn{position:relative;display:inline-block; padding:0 30px;height:60px;line-height:60px;font-size:30px; background:#a39876; border-radius:60px;color:#fff;-webkit-animation: bounce 2s infinite;-o-animation: bounce 2s infinite;animation: bounce 2s infinite; box-shadow:3px 5px 10px 3px rgba(48,44,124,0.2)}



.titlecon{padding:40px 0 20px 0; position:relative; font-size:0;color:#fff; text-align:center}
.titlecon .t1{ padding-bottom:20px;font-size:60px; line-height:1}
.titlecon .t1 .icon{display:inline-block;width:64px;vertical-align: top;margin: 0 10px 0 0;}
.titlecon .t1 .icon img{width: 100%}
.titlecon .t2{ font-size:30px; padding-bottom:10px; line-height:1;}
.titlecon .t3{ font-size:20px; line-height:1;}


.mr0{ margin-right:0!important}
.banner{ position:relative;width:100%; height:830px; background:url(../images/banner.jpg) center 0 no-repeat}
.banner .con{ margin:0 auto; width:1200px; height:830px; position:relative}
.banner .btn1{ position:absolute; left:598px; top:518px;  box-sizing:border-box;-webkit-animation: bounce 2s infinite;-o-animation: bounce 2s infinite;animation: bounce 2s infinite;}
.banner .con .p1{ position: absolute;left:232px;top:434px; width: 546px; font-size: 24px; line-height: 1; color: #fff}
.banner .con .p2{ position: absolute;left:258px;top:545px; width: 330px; font-size: 24px; line-height: 1.3; color: #fff}

.part1{width:100%;height: 1108px; background: url(../images/part1bg.jpg) center 0 no-repeat}
.part1 .con{ margin:0 auto; width:1200px; height:1108px; position:relative}
.part1 .con .p1{ position: absolute;left:516px;top:288px; width: 660px; font-size: 20px; line-height: 1.5;}
.part1 .con .p1 span{ display: inline-block; margin-right: 5px; margin-top:13px;width:4px; height:4px;background:#333;vertical-align: top}

.part1 .con .p2{ position: absolute; width:600px;line-height: 1.5;left:490px;top: 520px;font-size:22px;color:#fff}

.part2{width:100%;height: 976px; background: url(../images/part2bg.jpg) center 0 no-repeat}
.part2 .con{ margin:0 auto; width:1200px; height:976px; position:relative}

.part2 .tt2{  display: box;              /* OLD - Android 4.4- */
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */font-size:26px;line-height:1;padding-bottom:0.3rem;color:#fff;font-weight: 700;}
.part2 .tt2 span{  -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1;         /* OLD - Firefox 19- */
    width: 20%;               /* For old syntax, otherwise collapses. */
    -webkit-flex: 1;          /* Chrome */
    -ms-flex: 1;              /* IE 10 */
    flex: 1;    height:2px;background: #cfbebe; margin-top:13px;}
.part2 .tt2 p{margin:0 10px;}

.part2 .p2box{margin:50px auto 0 auto ;width:1070px;height:180px;background: linear-gradient(90deg,#83509a, #513977);}
.part2 .p2box .pic{padding-left:55px;float: left;width:259px;transform: translateY(-24px)}
.part2 .p2box .txt{float: left;width: 655px;padding:35px 0 0 30px;color: #fff;font-size: 22px;line-height: 1.5}

.part3{width:100%;height: 1112px;background: url(../images/part3bg.jpg) center 0 no-repeat}
.part3 .con{ margin:0 auto; width:1200px; height:1112px; position:relative}
.part3 .con .p1{position: absolute; width:550px;line-height: 1.5;left:512px;top:358px;font-size:22px;color:#fff}
.part3 .con .p2{position: absolute; width:550px;line-height: 1.5;left:45px;top:683px;font-size:22px}
.part3 .con .p2 p{text-indent: 44px; padding-bottom: 10px}
.part3 .con .p2 .r{color: #8b31a8}
.part3 .con .btncon{position: absolute;left:0;bottom: 0px}

.part4{width:100%;height:788px;background: url(../images/part4bg.jpg) center 0 no-repeat}
.part4 .con{ margin:0 auto; width:1200px; height:788px; position:relative}
.part4 .con .tt4{text-align: center}
.part4 .con .p1{position: absolute;width:532px;height: 362px;left:556px;bottom: 0;line-height: 1.5;font-size:21px}
.part4 .con .p1 p{text-indent: 40px; color:#fff;}
.part4 .con .p1  .btncon{position: absolute;left:0;bottom: 0px}

.part5{background:#f0f2f6;}
.part5 .con{ margin:0 auto; width:1200px;overflow: hidden;}
.part5 .con .p1box{width: 100%; height: 492px;position: relative;background: url(../images/p5_1.jpg) center 0 no-repeat}
.part5 .con .p1box .txt{position: absolute;width: 1076px;top: 350px;left: 70px;font-size: 18px;line-height: 1.6;color: #fff}
.p5slide .bd li{float: left;width:600px;}
.p5slide .bd li img{width:95%}

.p5slide .hd{padding:30px 0}
.p5slide .hd ul{text-align: center;font-size: 0;}
.p5slide .hd ul li{display: inline-block;margin-right:15px;width: 15px;height: 15px;border-radius:50%;background: #d4d5d9}
.p5slide .hd ul li.on{background: #d3a40d}

.part6{width:100%;height:812px;position: relative;background: url(../images/part6bg.jpg) center 0 no-repeat}
.part6 .con{margin: 0 auto; width: 1200px;height: 812px;position:relative}
.part6 .con .p1box{position: absolute;width: 355px;left: 157px;top: 220px;color: #fff}
.part6 .con .p1box .t1{font-size: 36px;line-height: 1;padding-bottom: 28px}
.part6 .con .p1box .t2{font-size: 30px;line-height: 1;padding-bottom: 28px}
.part6 .con .p1box .t3{font-size: 72px;line-height: 1;padding-bottom: 28px;color: #ffd800}
.part6 .con .p1box .t3 font{display: inline-block;vertical-align: middle;color: #fff;font-size: 48px}
.part6 .con .p1box .t4{text-align: center;padding-top: 20px}


.part9{width:100%;height:1086px;background: url(../images/part9bg.jpg) center 0 no-repeat}
.part9 .con{ margin:0 auto; width:1200px; height:1086px;overflow: hidden;;position:relative}
.part9 .con .p1{position: absolute;}
.part9 .con .p1.a{left:125px;top:345px;}
.part9 .con .p1.b{left:734px;top:280px;}
.part9 .con .p1.c{left:160px;top:662px;}
.part9 .con .p1.d{left:752px;top:640px;}
.part9 .con .btncon{position: absolute;left: 0;bottom: 0}

.light{
	cursor:pointer;
	position: absolute;
	left: -180px;
	top: 0;
	width: 80px;
	height: 100%;
	
	background-image: linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.2),rgba(255,255,255,0));
	background-image: -moz-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.2),rgba(255,255,255,0));
	background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.2),rgba(255,255,255,0));
	background-image: -o-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.2),rgba(255,255,255,0));
	background-image: -ms-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.2),rgba(255,255,255,0));
	
	transform: skewx(-25deg);
	-o-transform: skewx(-25deg);
	-moz-transform: skewx(-25deg);
	-webkit-transform: skewx(-25deg);
	-ms-transform: skewx(-25deg);
	
	animation:light_move 3.5s 1s infinite linear ;
	-webkit-animation:light_move 3.5s 1s infinite linear ;
	-moz-animation:light_move 3.5s 1s infinite linear ;
	-o-animation:light_move 3.5s 1s infinite linear ;
	-ms-animation:light_move 3.5s 1s infinite linear ;
}
@-webkit-keyframes tada {
	5% {
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
	}
	6%,
	8%,
	10%,
	12% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
	}

	7%,
	9%,
	11% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
	}

	13% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

@keyframes tada {
	5% {
		-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
		transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
	}
	6%,
	8%,
	10%,
	12% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
	}

	7%,
	9%,
	11% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
	}

	13% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

}
@keyframes light_move {
0% {left:-180px;}
30%{left:720px}
75%{left:20px;}
100%{left:720px;}
}
@-moz-keyframes light_move {
0% {left:-180px;}
30%{left:720px}
75%{left:20px;}
100%{left:720px;}
}
@-webkit-keyframes light_move {
0% {left:-180px;}
30%{left:720px}
75%{left:20px;}
100%{left:720px;}
}
@-o-keyframes light_move{
0% {left:-180px;}
30%{left:720px}
75%{left:20px;}
100%{left:720px;}
}
@-ms-keyframes light_move{
0% {left:-180px;}
30%{left:720px}
75%{left:20px;}
100%{left:720px;}
}

@keyframes tran{
0% {transform: rotate(-45deg); }
30%{transform: rotate(-30deg); }
100%{transform: rotate(0deg); }}

}

@keyframes movement2 {
    0% {
        -webkit-transform: translate(0px,0px);
        transform: translate(0px,0px);
    }
    25% {
        -webkit-transform: translate(3px,6px);
        transform: translate(3px,6px);
    }
    50% {
        -webkit-transform: translate(6px,-3px);
        transform: translate(6px,-3px);
    }
    75% {
        -webkit-transform: translate(-8px,0px);
        transform: translate(-8px,0px);
    }
    100% {
        -webkit-transform: translate(0px,0px);
        transform: translate(0px,0px);
    }
}
@-webkit-keyframes movement2 {
    0% {
        -webkit-transform: translate(0px,0px);
        transform: translate(0px,0px);
    }
    25% {
        -webkit-transform: translate(3px,6px);
        transform: translate(3px,6px);
    }
    50% {
        -webkit-transform: translate(6px,-3px);
        transform: translate(6px,-3px);
    }
    75% {
        -webkit-transform: translate(-8px,0px);
        transform: translate(-8px,0px);
    }
    100% {
        -webkit-transform: translate(0px,0px);
        transform: translate(0px,0px);
    }
}


/*需要添加的视频css*/
.add-ship{ width:100%; height:100%; background: rgba(0,0,0,0.5); position: fixed; top: 0; left: 0; display:none;}
.add-ship .ClickVideoClose{ position: absolute; top: 10px; right:10px; width:40px; cursor: pointer;}
.add-ship .videoPlay{width:640px; height:360px; padding:0;text-align:left !important; position: absolute; left: 50%; top: 50%;transform:translate(-50%,-50%);}
@media only screen and (max-width: 639px) {
.add-ship .videoPlay{width:414px; height:233px; padding:0;margin:0;}
}
@media only screen and (max-width: 375px) {
.add-ship .videoPlay{width:375px;height:210px; padding:0;margin:0;}
}
@media only screen and (max-width: 320px) {
.add-ship .videoPlay{width:320px;  height:180px; padding:0;margin:0}
}
@-webkit-keyframes bounce {
    from, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
    }

    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -6px, 0);
        transform: translate3d(0, -6px, 0);
    }

    90% {
        -webkit-transform: translate3d(0,-2px,0);
        transform: translate3d(0,-2px,0);
    }
}

@keyframes bounce {
    from, 20%, 53%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
    }

    40%, 43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -6px, 0);
        transform: translate3d(0, -6px, 0);
    }

    90% {
        -webkit-transform: translate3d(0,-2px,0);
        transform: translate3d(0,-2px,0);
    }
}