﻿@charset "utf-8";
/*CSS Document*/
html,body{font-size:14px; font-family:"Microsoft YaHei",Verdana,Geneva,sans-serif,\5b8b\4f53;}
/*css-reset*/
html,body,div,ul,ol,li,dl,dt,dd,p,span,em,strong,b,i,h1,h2,h3,h4,form,input,button,textarea,select,option,img,a{margin:0; padding:0}
h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-size:100%;}
html{_filter:expression(document.execCommand("BackgroundImageCache",false,true));}
ul,li,div,dl,dt,dd{list-style:none;}
/*
body table{border-collapse:separate; border-spacing:2px;}
*/
input{outline: none;font-size:14px; font-family:"Microsoft YaHei"}
input::-ms-clear{display:none;}
h1.wm-public{height:0px; line-height:0px; font-size:0px;}
a{text-decoration:none; cursor: pointer;}
a{blr:expression(this.onFocus=this.blur());outline:none;}
a:hover{text-decoration:none;}
img{border:0; object-fit: cover;}
font,em{font-style:normal; font-family:\5b8b\4f53;}
label{vertical-align:middle; font-family:tahoma;}
textarea,input{resize:none; outline:none;}
textarea{overflow:auto;}
ins{float:right; text-decoration:none; font-weight:normal;}
.pub_wsp{word-wrap:break-word; word-break:break-all;}
.pub_abso{vertical-align:middle;}
.pub_clr{clear:both;font-size:0;height:0;line-height:0;overflow:hidden;}
.pub_yh{font-family:"Microsoft YaHei";}
.none{display:none;}
/*公用浮动*/
.fl{float: left}
.fr{float: right}
/*浮动清理*/
.cf:before,.cf:after{content:".";display:block;height:0;visibility:hidden}
.cf:after{clear:both}
.cf{zoom:1}
.auto{left: 50%; -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); transform:translate(-50%,0);}
.swiper-pagination-bullet:focus,
.swiper-button-prev:focus,
.swiper-button-next:focus{outline: none;}

html, body{max-width: 1920px; margin: 0 auto; background: #000;}
body{-webkit-text-size-adjust: 100%;}
.wrap{position: relative; width: 1200px; margin: 0 auto;}

/*header*/
.header{background: url(../images/bg_header.jpg) no-repeat center top;}
.header .wrap{height: 1000px;}
.header_btn{position: absolute; top: 810px; left: 50%; transform: translate(-50%,0); width: 370px; height: 80px; background: url(../images/header_btn.png) no-repeat 0 0;}
.header_btn:hover{background-position: 0 bottom;}

/*主体部分*/
.content{background:#0b0f1b url(../images/bg_content.jpg) no-repeat center top;}
.content .wrap{padding: 70px 0 100px 0; box-sizing: border-box;}
.content_nav{display: flex; justify-content: center; height: 150px; margin: 0 15px;}
.content_nav a{width: 345px; height: 87px; display: block; cursor: pointer;}
.content_nav a.n1{background: url(../images/nav1.png) no-repeat 0 0;}
.content_nav a.n2{background: url(../images/nav2.png) no-repeat 0 0;}
.content_nav a.n3{background: url(../images/nav3.png) no-repeat 0 0;}
.content_nav a.on,.content_nav a:hover{background-position: 0 bottom;}

.page_cont{display: none;}
.page1_box1{margin: 0 auto; width: 1146px; height: 333px; box-sizing: border-box; padding: 120px 35px 0 35px; background: url(../images/page1_box1.png) no-repeat 0 0; line-height: 42px; font-size: 24px; color: #FFF;}
.page1_box2{position: relative; margin: 100px auto 0 auto; width: 968px; height: 310px; background: url(../images/page1_box2.png) no-repeat 0 0;}
.page1_box2 dl{position: absolute; top: 196px; width: 212px; height: 113px; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; color: #FFF;}
.page1_box2 dt, .page1_box2 dd{width: 100%; text-align: center;}
.page1_box2 dt{font-size: 24px;}
.page1_box2 dd{font-size: 16px;}
.page1_subBox1{left: 0px;}
.page1_subBox2{left: 252px;}
.page1_subBox3{left: 504px;}
.page1_subBox4{left: 756px;}
.page1_box3{margin: 100px auto 0 auto; width: 1146px; height: 1227px; box-sizing: border-box; padding: 120px 55px 0 55px; background: url(../images/page1_box3.png) no-repeat 0 0;}
.page1_box3 dl{margin-bottom: 20px; color: #FFF;}
.page1_box3 dt, .page1_box3 dd{padding-bottom: 10px;}
.page1_box3 dt{font-weight: bold; font-size: 24px;}
.page1_box3 dd{line-height: 30px; font-size: 18px;}
.page1_box3_more{display: block; margin: 30px auto 0 auto; width: 260px; height: 55px; line-height: 55px; text-align: center; box-sizing: border-box; border-radius: 5px; background: #1db9dc; border: 1px solid #1db9dc; font-size: 18px; color: #000;}
.page1_box4{width: 100%; height: 2226px; background: url(../images/page1_box4.png) no-repeat center 0; margin: 0 auto;}
.box4Cont{display: flex; justify-content: center;}
.boxli{width: 298px; height: 203px; background: url(../images/li.png) no-repeat 0 0;}
.boxli span{display: block; padding-left: 48px; width: 222px; padding-top: 30px; height: 121px;}
.boxli img{display: block; width: 114px; height: 114px; border-radius: 114px; border: 2px solid #4c99c1; margin: 0 auto;}
.boxli p{text-align: center; font-size: 16px; color: #FFF; padding-left: 48px; width: 222px;}
.box41{padding: 345px 0 0 0; height: 386px;}
.box42{height: 386px;}
.box43{height: 386px;}
.box44{height: 386px;}
.box45{height: 230px;}

.page2_cont{position: relative; padding-bottom: 200px;}
.page2_tit{height: 88px; background: url(../images/page2_tit.png) no-repeat center 0;}
.page2_btn{position: absolute; top: 0px; right: 0px; width: 218px; height: 58px; background: url(../images/page2_btn.png) no-repeat 0 0;}

.works{display: flex; flex-wrap: wrap; width: 1176px; margin: 0 auto;}
.item{position: relative; width: 264px; height: 415px; background: url(../images/item.png) no-repeat 0 0;}
.works .item{margin: 0 15px 40px 15px;}
.pic{position: absolute; top: 21px; left: 50%; transform: translate(-50%,0); width: 222px; height: 333px; border-radius: 5px; background: #FFF; overflow: hidden;}
.pic img{display: block; width: 100%; height: 100%;}
.pic p{position: absolute; bottom: 0; left: 0; width: 100%; line-height: 42px; line-height: 42px; text-align: center; background: rgba(0,0,0,0.4); font-size: 18px; color: #FFF;}
.vote{position: absolute; top: 368px; left: 50%; transform: translate(-50%,0); width: 222px; display: flex; justify-content: space-between; font-size: 18px; color: #FFF;}
.vote p span{vertical-align: middle;}
.vote a:after{content: ""; display: inline-block; vertical-align: middle; margin-left: 10px; width: 28px; height: 23px; background: url(../images/vote.png) no-repeat 0 0;}
.vote a.on:after{background-position: 0 -23px;}

.page3_cont{padding-bottom: 100px;}
.page3_tit{height: 88px; background: url(../images/page3_tit.png) no-repeat center 0;}

.page3_box{display: flex; flex-wrap: wrap; width: 1176px; margin: 0 auto 60px auto; padding-top: 90px;}
.page3_box1{justify-content: space-between; background: url(../images/page3_box1.png) no-repeat center top;}
.page3_box2{justify-content: space-between; background: url(../images/page3_box2.png) no-repeat center top;}
.page3_box3{background: url(../images/page3_box3.png) no-repeat center top;}
.page3_box3 .item{margin: 0 15px 40px 15px;}
.page3_box4{background: url(../images/page3_box4.png) no-repeat center top;}
.page3_box4 .item{margin: 0 15px 40px 15px;}

/*弹出框：上传作品*/
.pop{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 10; display: none;}
.pop_cont{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); box-sizing: border-box; padding-top: 150px;}
.pop_close{position: absolute; top: 5px; right: -46px; width: 33px; height: 34px; background: url(../images/pop_close.png) no-repeat 0 0;}
.pop_close:hover{background-position: -33px 0;}
.pop_cont1{width: 926px; height: 801px; background: url(../images/pop1.png) no-repeat 0 0;}
.pop1_main{padding-right: 10px; width: 600px; height: 480px; margin: 0 auto; font-size: 18px; color: #FFF; overflow-x: hidden; overflow-y: auto;}
.scrollbar::-webkit-scrollbar{width: 7px; background:#1a384d;}
.scrollbar::-webkit-scrollbar-thumb{background:#132737;}
.row{margin-bottom: 20px;}
.rowIn{display: flex; justify-content: space-between;}
.rowIn p{width: 130px; text-align: right; line-height: 49px;}
.rowIn input, .rowIn select{width: 452px; height: 49px; line-height: 49px; padding: 0 15px; box-sizing: border-box; background: #f7fcff; border: 2px solid #87aeb1; font-size: 16px; color: #000; outline: none;}
.uploads{display: flex; flex-wrap: wrap; justify-content: center;}
.uploads div{position: relative; width: 88px; height: 88px; margin: 10px 43px; border: 1px solid #63b3dc; background: #63b3dc;}
.uploads p{position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; padding-top: 60px; text-align: center; background: url(../images/icon_add.png) no-repeat center 24px; font-size: 12px; color: #29434c;}
.uploads input, .uploads img{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.uploads input{opacity: 0;}
.uploads img{display: none;}
.upload_rule{line-height: 18px; font-size: 14px;}
.upload_rule li{position: relative; padding-left: 2em;}
.upload_rule .num{position: absolute; top: 0; left: 0;}
.upload_submit{display: block; margin: 50px auto 0 auto; width: 259px; height: 56px; background: url(../images/upload_submit.png) no-repeat 0 0;}
.upload_submit:hover{background-position: 0 bottom;}
.upload_tip{margin-top: 10px; text-align: center; font-size: 14px; color: #e53636;}

/*弹出框：大赛奖励*/
.pop_cont2{width: 1146px; height: 615px; background: url(../images/pop2.png) no-repeat 0 0;}
.pop2_main{width: 1005px; height: 420px; margin: 0 auto; overflow-x: hidden; overflow-y: auto; color: #FFF;}
.pop2_main dl{margin-bottom: 25px;}
.pop2_main dt{font-weight: bold; font-size: 20px;}
.pop2_main dd{line-height: 28px; font-size: 18px;}

/*弹出框：领取投票奖励*/
.pop_cont3{width: 1146px; height: 615px; background: url(../images/pop3.png) no-repeat 0 0;}
.pop3_main{display: flex; justify-content: center; width: 1100px; margin: 30px auto 0 auto;}
.pop3_subBox{position: relative; width: 298px; height: 300px; background: url(../images/pop3_subBox.png) no-repeat center top;}
.pop3_subBox img{position: absolute; top: 32px; left: 92px; width: 114px; height: 114px; border-radius: 57px;}
.pop3_subBox .name{position: absolute; top: 160px; left: 43px; width: 204px; text-align: center; font-size: 16px; color: #FFF;}
.pop3_subBox .tip{position: absolute; top: 212px; left: 43px; width: 204px; text-align: center; font-size: 16px; color: #5b9abb;}
.pop3_subBox a{position: absolute; top: 248px; left: 36px; width: 222px; height: 48px; background: url(../images/pop3_submit.png) no-repeat 0 0;}
.pop3_subBox a:hover{background-position: 0 -48px;}
.pop3_subBox a.on{background-position: 0 -96px; cursor: default;}

/*弹出框：绑定*/
.pop_cont4{width: 846px; height: 476px; padding-top: 166px; box-sizing: border-box; background: url(../images/pop4.png) no-repeat 0 0;}
.bind_row{margin: 0 auto 20px auto; width: 550px; display: flex; align-items: center;}
.bind_row p{width: 100px; text-align: right; font-size: 18px; color: #FFF;}
.bind_row select{width: 452px; height: 50px; box-sizing: border-box; background: #87aeb1; border: 2px solid #87aeb1; font-size: 16px; color: #000; outline: none;}
.bind_btn{display: block; margin: 40px auto 0 auto; width: 258px; height: 56px; background: url(../images/bind_btn.png) no-repeat 0 0;}
.bind_btn:hover{background-position: 0 bottom;}




