* { box-sizing: border-box; font-family:"Microsoft YaHei"; text-transform: uppercase;}
body{ min-width: 1300px;}
body,h1,h2,h3,h4,h5,h6,p,span,ul,li,img { margin:0; padding:0; font-weight:normal;}
h1,h2,h3,h4,h5,h6 { text-transform: uppercase;}
li{ list-style:none;}
a{ text-decoration:none; color:#000; display: block;}
img{ display:block;}
p { font-size: 14px; line-height: 30px;}
.justify { -webkit-box-pack: justify;text-align:justify;}
.clearfix:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix{zoom:1;}

.left { float:left;}
.right { float:right;}
.img_box { position: relative; overflow: hidden;}
.tra1 { transition: all 1s ease-out;}
.w1200 { width: 1200px; margin: auto; position: relative;}

.header { position: relative; overflow: hidden;}
.header .roll { position: absolute; left:50%; bottom:45px; margin-left: -7px; z-index: 3; width: 14px; color: #fff; animation:mouse 1s ease infinite alternate;}
.header .roll p { line-height: 15px; margin-bottom: 10px;}
.header .mouse { position: relative;}
@keyframes mouse {
    0% { transform: translate(0,0);}
    100% { transform: translate(0,15px);}
}

#logo { position: fixed; top:70px; left: 70px; z-index: 1000; transition: all 0.3s ease; opacity: 1; }


#nav_top { position: fixed; top:-200px; left: 0; width: 100%; z-index: 999; background: #000; min-width: 1300px;}
#nav_top ul { width: 64%; float: right;}
#nav_top ul li { float: left; margin: 0 2%;}
#nav_top ul li a { color: #fff; font-size: 17px; line-height:17px; padding: 31px 0 36px; text-align: center;}
#nav_top ul li a span { display: block; margin-top: 9px; font-size: 12px; line-height: 12px;}
#nav_top ul li:last-child { color: #fff; background: linear-gradient(90deg,#ee0048,#8100bb); height: 35px; line-height: 35px; padding: 0 15px; margin-top: 29px; font-size: 18px;}
#nav_top ul li:hover a { color: #ed0041;}
@media (max-width: 1700px) {
    #nav_top ul { width: 78%;}
}
@media (max-width: 1470px) {
    #nav_top ul { width: 82%;}
}
@media (max-width: 1401px) {
    #nav_top ul { width: 75%;}
    #nav_top ul li { margin: 0 1.4%;}
}

#menu { position: fixed; top:75px; right:75px; z-index: 9999; height: 82px; overflow: hidden; transition: all 0.3s ease;}
#menu:hover .button { display: none;}
#menu:hover { height: 310px; background: url("../images/nav_bg.png") no-repeat;}
#menu p { color: #fff; text-align: center; line-height: 14px; margin-top: 9px; letter-spacing: 3px; overflow: hidden; height: 14px;}
#menu ul { width: 59px; overflow: hidden; padding: 28px 0 0;}
#menu ul li { color: #fff; font-size: 14px; line-height: 30px; text-align: center;}
#menu ul li a { color: #fff;}
#menu ul li:hover a { color: #ed0041;}




.header video { min-width: 100%; min-height: 100%; position: absolute; top:0; left: 0;}

/*banner*/
.banner { position: relative; width: 100%; height: 100vh; background: url("../images/banner_bg.jpg") no-repeat; background-size:cover; }
.banner > img { opacity: 0; width: 100%;}
#banner { position: absolute; top:0; left: 0; width: 100%; height: 100%;}
#banner li { position: absolute; top:50%; margin-top: -106px; left: 0; width: 100%; height: 100%; opacity: 0; transition: all 1s ease;}
#banner li img { margin: auto;}
#banner li.on { opacity: 1;}
/*#banner li:nth-child(1) { background: url("../images/banner.jpg") no-repeat; background-size:cover;}*/
#banner li:nth-child(1) h2 { font-size:26px; line-height: 26px; letter-spacing: 4px;}
#banner li:nth-child(1) h3 { font-size:16px; line-height: 16px;}
/*#banner li:nth-child(2) { background: url("../images/banner1.jpg") no-repeat; background-size:cover;}*/
#banner li:nth-child(2) h2 { font-size:24px; line-height: 24px; font-weight: 300;}
#banner li:nth-child(2) h3 { font-size:16px; line-height: 16px; letter-spacing: 3px;}
/*#banner li:nth-child(3) {background: url("../images/banner2.jpg") no-repeat; background-size:cover;}*/
#banner li:nth-child(3) h2 { font-size:26px; line-height: 26px; font-weight: 300;}
#banner li:nth-child(3) h3 { font-size:16px; line-height: 16px;}

footer { background: url("../images/footer_bg.jpg") no-repeat bottom; background-size: cover; padding: 170px 0 140px; text-align: center; color: #fff;}
footer a { color: #fff;}
footer a:hover { color: #a09e9f;}
footer img { margin: auto;}
footer h1 { margin: 27px 0 12px;}
footer h2 { font-size: 32px; line-height: 32px;}
footer h3 { font-size: 25px; line-height: 25px; margin: 11px 0 13px;}
footer h4 { font-size: 24px; font-weight: bold; line-height: 24px;}
footer h5 { font-size: 14px; line-height: 14px; margin: 16px 0 27px;}
footer p { font-size: 12px;}
footer .bbs_button { background: linear-gradient(90deg,#ee0048,#8100bb); color: #fff; font-size: 20px; text-align: center; line-height: 36px; width: 415px; margin:15px auto 0; font-weight: bold; letter-spacing: 2px; transition: all 0.3s ease;}
footer .bbs_button span { padding-left: 55px; font-weight: bold;}
footer .bbs_button:hover { color: #fff; box-shadow:#a500c0 0 0 5px 5px;}


h2.title2 { background: linear-gradient(90deg,#ee0048,#8100bb); color: #fff; font-weight: bold; font-size: 48px; line-height: 74px; text-align: center;}
h2.title2 span { margin-left: 18px;}

.classify { background: #e3e3e3; text-align: center;}
.classify a { display:inline-block; background: #000; color: #fff; font-size: 16px; line-height: 35px; padding: 0 34px; margin: 13px 17px;}
.classify a:hover { background: linear-gradient(90deg,#ee0048,#8100bb);}