/* 
* @Author: anchen
* @Date:   2019-08-01 15:19:57
* @Last Modified by:   anchen
* @Last Modified time: 2019-08-02 15:12:18
*/

/* 公共样式 */
*{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;}
html, body, h1, h2, h3, h4, h5, h6, div, ol, ul, li, dl, dt, dd, table, caption, tr, th, td, span, p, a, b, u, i, em, img, iframe, fieldset, form, label, legend, input, button, select, textarea { margin: 0; padding: 0; }
body { font: 14px/1.5 "Microsoft YaHei", Arial, Tahoma, Helvetica, sans-serif; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased !important; margin: 0 auto; color:#333; font-family:微软雅黑,'Heiti SC',黑体,Arial;position:relative;}
input, button, textarea, select { font: 14px/100% "Microsoft YaHei", Arial, Tahoma, Helvetica, sans-serif; outline: 0; border: 0; background: none; color:#333; }
input:focus, textarea:focus { color:#333; }
input::-ms-clear{display:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;color:#333;line-height:1.2;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:inherit;}
ol, ul, li { list-style: none; }
select { appearance: none; -moz-appearance: none; -webkit-appearance: none; }
textarea { overflow:auto; resize:none; }
table { border-collapse: collapse; border: 0; }
caption, th { font-weight:normal; }
img { border: 0; outline:0; }
i,em,b,strong{font-style:normal;font-weight:normal;}
a{text-decoration:none;color:inherit;cursor:pointer;}
a:focus{outline:0;}

.clearfix:after,
.popbox .middle dl:after{content:'';display:block;clear:both;height:0;visibility:hidden;font-size:0;}

.ul2 li a:hover,.ul3 li a:hover{
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -ms-transition: all 0.4s;
}

body{
    width: 100%;
}
body.bodybg{
    background: #f6f9fe;
}
.container{
    width: 1000px;
    margin: 0 auto;
}
.vttop{
    padding: 60px 0 0 0;
    height: 400px;
    background: -webkit-linear-gradient(left, #64cafa , #6561f4); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(right, #64cafa, #6561f4); /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(right, #64cafa, #6561f4); /* Firefox 3.6 - 15 */
    background: linear-gradient(to right, #64cafa , #6561f4); /* 标准的语法 */
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr=#64cafa, endColorstr=#6561f4);
    position:relative;
}
#water{
    position: absolute;
    bottom: 0;
    left: 0;
}
.topbox .numbox{
    margin: 0 -50px;
}
.numbox .item{
    width: 33.3333333%;
    padding: 0 50px;
    float: left;
    text-align: center;
}
.numbox .item h3{
    color:#fff;
    font-size: 24px;
    line-height: 80px;
    margin-bottom: 10px;
}

/* 数字滚动 */
.dataNums{display: block;height:66px; text-align:center;left: 0;}
.dataNums .dataOne{ width:36px; height:66px; margin: 0px 3px; text-align: center; background: #e52e25;font-family: "Arial";border-radius: 5px;float: left;list-style: none;
    color:#fff;}
.dataNums .dataBoc {position: relative; width: 100%; height: 100%; overflow: hidden;}
.dataNums .dataBoc .tt {position: absolute; top: 0;  left: 0; width: 100%;  height: 100%;}
.dataNums .tt span{width:100%;height:100%; font:normal 54px/75px "Arial";color:#fff;font-size: 36px;line-height: 68px;float: left;}
@media screen and (max-width: 1320px) {
.dataNums {
    height:120px;
}
.dataNums .dataOne{
    width:70px; height:120px; 
}
.dataNums .tt span{
    font-size: 100px;line-height: 120px;
}
.dataLine{line-height: 175px;}
}
.dataNum1{
    position: absolute;
    top: 56%;
    width: 20%;
    float: left;
    /* padding-right: 4%; */
    color: #fff5a1;
    font-size: 36px;
    text-align: center;
    left: 17%;
}
.dataNum2{
    position: absolute;
    top: 56%;
    width: 20%;
    float: left;
    color: #fff5a1;
    font-size: 36px;
    text-align: center;
    left: 40%;
}
.dataNum3{
    position: absolute;
    top: 56%;
    width: 20%;
    float: left;
    padding-left: 5%;
    color: #fff5a1;
    font-size: 36px;
    text-align: center;
    left: 60%;
}
.dataIcon{
    font-size: 67px;
    float: left;
    font-style: normal;
}
#dataNum0 .dataNums .dataOne{
    background:#ffaa45;
}
#dataNum1 .dataNums .dataOne{
    background:#7ca5ff;
}
#dataNum2 .dataNums .dataOne{
    background:#74d4c8;
}

/* 社团展示-志愿者风采 */
.ul1 {
    margin: 0 -16px 35px -16px;
}
.ul1 li{
   width: 50%;
   padding: 0 16px;
   float: left;
   height: 200px;
}
.ul1 li a{
    display: block;
    background: #ebf3fe;
    border: solid 1px #ececec;
}
.ul1 li a img{
    display: block;
    float: left;
}
.ul1 li a .txt{
    width: 154px;
    float: right;
    text-align: center;
    padding: 40px 0 0 0;
    margin-right: 50px;
}
.ul1 li a .txt h3{
    font-size: 24px;
}
.ul1 li a .txt p{
    color:#999999;
    font-family: '宋体';
    margin: 15px 0 32px;
}
.ul1 li a .txt span{
    display: inline-block;
    width: 122px;
    height: 36px;
    border: solid 1px #dddddd;
    line-height: 36px;
    color:#999999;
}

.pubtitle{
    height: 50px;
    border-bottom: solid 1px #eaedf1;
    margin: 0px 0 35px;
    position: relative;
}
.pubtitle.mb0{
    margin-bottom: 0px;
}
.pubtitle:after{
    position: absolute;
    display: block;
    height: 1px;
    background:#fff;
    width: 100%;
    content: '';
    left: 0;
    bottom: -2px;
}
.pubtitle h2{
    float: left;
    padding: 0 0 0 34px;
    background: url(../images/icon-title.png) left top no-repeat;
}
.pubtitle h2 span{
    font-family: '宋体';
    color:#cccccc;
    margin-left: 10px;
    font-size: 16px;
}
.pubtitle a{
    font-family: '宋体';
    color:#cccccc;
    margin-left: 10px;
    font-size: 12px;
    border: solid 1px #cccccc;
    border-radius: 2px;
    display: block;
    width: 44px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    position: absolute;
    right: 0; 
    top: 2px;
    padding-right: 4px;
}
.pubtitle a:after{
    position: absolute;
    display: block;
    content: '';
    width: 0; 
    height: 0;
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
    border-left:4px solid #ccc;
    right: 3px;
    top: 4px;
}
.ul2{
    margin: 0 -16px;
}
.ul2 li{
    width: 33.333333%;
    float: left;
    padding: 0 16px;
    margin-bottom: 32px;
}
.ul2 li a{
    display: block;
    position: relative;
    z-index: 2;
}
.ul2 li .liimg{
    height: 236px;
    overflow: hidden;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.ul2 li .liimg img{
    width: 100%;
    height:100%;
}
.ul2 li .txt{
    height: 146px;
    padding: 24px;
    background: #fff;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    position: relative;
}
.ul2 li .txt i{
    display: block;
    height: 6px;
    width: 100%;
    background:#e9ecf1;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    position: absolute;
    bottom: 0px;
    left: 0;
    z-index: 1;
}
.ul2 li .txt i:after{
    display: block;
    content: '';
    height: 6px;
    width: 100%;
    background:#fff;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    position: absolute;
    bottom: 4px;
    left: 0;
    z-index: 1;
}
.ul2 li .txt h2,
.ul2 li .txt p{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.ul2 li .txt h2,
.ul3 li a .txt h2{
    font-size: 18px;
    margin-bottom: 10px;
}
.ul2 li .txt p,
.ul3 li a .txt p{
    color:#666666;
    line-height: 24px;
}
.pb4{
    padding-bottom: 40px;
}
.ul2 li a:hover,.ul3 li a:hover{
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
}

.ul3 {
    margin: 0 -20px;
}
.ul3 li{
    width: 50%;
    padding: 0 20px;
    float: left;
    margin-bottom: 20px;
}
.ul3 li a{
    display: block;
    position: relative;
    height: 174px;
    overflow: hidden;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.ul3 li a .liimg{
    position:absolute;
    top: 0;
    left: 0;
    width: 120px;
    height: 174px;
}
.ul3 li a .liimg img{
    width: 100%;
    height: 100%;
}
.ul3 li a .txt{
    background:#fff;
    margin-left: 120px;
    height: 100%;
    padding: 0 25px;
    position: relative;
}
.ul3 li a .txt h2{
    line-height: 30px;
    padding: 15px 0 0;
}
.ul3 li a .txt p{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.ul3 li a .txt:after{
    display: block;
    content: '';
    width: 100%;
    height: 3px;
    background: #e9ecf1;
    position: absolute;
    bottom: 0;
    left: 0;
}

.fl_con{margin: 20px 0 35px; padding:12px 25px 12px; overflow:hidden; position:relative;
background:#fff;}
.fl_con3{height:68px;}
.fl_con2{ min-height:68px; height:auto; }
.fl_con dt{ float:left; width:60px; letter-spacing:5px; margin:10px 0 0;}
.fl_con dd{ float:left; width:880px; margin:10px 0 0;text-align: left; }
.fl_con dd a{ display:inline-block; padding:0 11px; margin:0 2px 10px; }
.fl_con dd a:hover, .fl_con dd a.on{color:#fff; background:#6085cb;}


.pubdbox{
    height: 212px;
    background:#fff;
    position: relative;
    margin-bottom: 35px;
    border-radius: 4px;
    overflow: hidden;
}
.pubdbox .imgbox{
    position: absolute;
    top: 0;
    left: 0;
    width: 240px;
    height: 212px;
}
.pubdbox .imgbox img{
    width: 100%;
    height: 100%;
}
.pubdbox .imgbox a{
    width: 98px;
    height: 34px;
    display: block;
    position: absolute;
    bottom: 10px;
    left: 50%;
    margin: 0 0 0 -49px;
    background:#6085cb;
    color:#fff;
    text-align: center;
    line-height: 34px;
    border-radius: 20px;
    font-size: 16px;
}
.pubdbox .itemtxt{
    margin-left: 260px;
    padding: 10px 20px 10px 0;
    height: 212px;
    overflow-y: auto;
}
.pubdbox .itemtxt ul li{
    float: left;
    width: 32%;
    font-size: 16px;
    line-height: 30px;
}
.pubdbox .itemtxt ul li:first-child{
    width: 100%;
}
.pubdbox .itemtxt ul li span,
.pubdbox .itemtxt dl dd{
    color:#666;
}
.pubdbox .itemtxt dl dt{
    font-size: 16px;
    line-height: 30px;
}
.pubdbox .itemtxt dl dd{
    overflow: hidden;
    line-height: 23px;
}
.pubdbox.people .imgbox{
    width: 140px;
}
.pubdbox.people .imgbox a{
    display: none;
}
.pubdbox.people .itemtxt{
    margin-left: 170px;
}
.pubdbox.people ul li{
    float: none;
    line-height: 32px;
}

.popbox{
    position: fixed;
    width: 600px;
    min-height: 660px;
    background: #fff;
    z-index: 99;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -300px;
    border-radius: 6px;
    overflow: hidden;
    display: none;
    padding-bottom:20px;
}
.popbox .top{
    height: 60px;
    padding: 0 20px;
    position: relative;
}
.popbox .top h2{
    font-size: 16px;
    line-height: 60px;
    margin-bottom: 10px;
}
.popbox .top i{
    width: 30px;
    height: 30px;
    display: block;
    background: url(../images/icon-close.png) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    right: 15px;
    top: 15px;
    cursor: pointer;
}
.popbox .middle{
    padding: 0 25px;
}
.popbox .middle dl{
    margin-bottom: 18px;
}
.popbox .middle dl dt,
.popbox .middle dl dd{
    display: block;
    float: left;
    line-height: 40px;
    font-size: 16px;
}
.popbox .middle dl dt{
    width: 100px;
    text-align: right;
}
.popbox .middle dl dd{
    width: 400px;
}
.popbox .middle dl dd input[type="text"],
.popbox .middle dl dd textarea{
    width: 100%;
    border: solid 1px #e3e3e3;
    padding: 0 10px;
}
.popbox .middle dl dd input[type="text"]{
    height: 38px;
    line-height: 38px;
    color:#555;
}
.popbox .middle dl dd span{
    margin-right: 20px;
    position: relative;
}
.popbox .middle dl dd input[type="radio"],
.popbox .middle dl dd input[type="checkbox"]{
    vertical-align: middle;
    margin-right: 5px;
}
.popbox .middle dl dd input[type="checkbox"]{
    margin-right: 10px;
}
.popbox .middle dl dd input[type="radio"] + label,
.popbox .middle dl dd input[type="radio"]:checked + label{
    display: block;
    width: 14px;
    height: 14px;
    background: #fff;
    border: solid 1px #e4e4e4;
    border-radius: 50%;
    position: absolute;
    left: 0px;
    top: 5px;
}
.popbox .middle dl dd input[type="radio"]:checked + label:after{
    display: block;
    content: '';
    width: 6px;
    height: 6px;
    background: #6085cb;
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 50%;
}
.popbox .middle dl dd input[type="checkbox"] + label,
.popbox .middle dl dd input[type="checkbox"]:checked + label{
    display: block;
    width: 16px;
    height: 16px;
    background: #fff;
    border: solid 1px #e4e4e4;
    position: absolute;
    left: 0px;
    top: 3px;
}
.popbox .middle dl dd input[type="checkbox"]:checked + label:after{
    display: block;
    content: '';
    width: 12px;
    height: 10px;
    background: url(../images/icon-selectcheck.png) no-repeat;
    position: absolute;
    top: 1px;
    left: 1px;
    border-radius: 50%;
    z-index: 1;
}
.popbox .middle dl dd textarea{
    min-height: 200px;
    padding: 15px;
}
#communitbtn{
    display: block;
    border: none;
    outline: none;
    background: #6085cb;
    width: 180px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    color:#fff;
    margin: 0 0 0 100px;
}
#communitbtn i{
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url(../images/icon-confirem.png) no-repeat;
    vertical-align: middle;
    margin-right: 5px;
}

.contentbox{
    background:#fff;
    padding: 0 35px 35px;
}
.titlebox{
    text-align: center;
    border-bottom: dashed 1px #e1e0e0;
}
.titlebox .title{
    padding-top: 40px;
    color:#6085cb;
    line-height: 30px;
}
.titlebox p{
    margin: 28px 0 30px;
    color: #999;
}
.titlebox p span{
    margin: 0 20px;
}

/*表单验证提示信息*/
.popbox .middle .form-info{
    color: red;

    font-size: 12px;
}


/*志愿者点赞*/
.praisebox{
    cursor: pointer;
    position: absolute;
    display: block;
    padding: 4px 20px;
    background: #3bb5ff;
    text-align: center;
    right: 20px;
    top: 20px;
    z-index: 22;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    color: #fff;
    font-size: 16px;
}
.praisebox img{
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-right: 5px;
}
.praisebox.active{
    background: #fe5050;
}


/**/
.order_edit{
    width: 500px;
    padding: 30px 0 20px;
    margin: 0 auto;
}
.order_edit dl{
    height: 40px;
    line-height: 40px;
    margin-top: 20px;
}
.order_edit dl dt,
.order_edit dl dd{
    float: left;
}
.order_edit dl dt{
    width: 80px;
}
.order_edit dl dd{
    width: 420px;
}
.order_edit dl dd input,
.order_edit dl dd select,
.order_edit dl dd textarea{
    box-sizing: border-box;
    background: #f2f2f2;
    height: 38px;
    line-height: 38px;
    padding: 0 10px;
    width: 70%;
    display: block;
}
.order_edit dl dd textarea{
    height: 100px;
    line-height: 22px;
    padding: 10px;
    width: 100%;
}
.order_edit .layui-input-inline{
    width: 100%;
    display: block;
}
.order_edit dl.filedl dd,
.order_edit dl.heightauto{
    height: auto;
}
.order_edit dl.filedl dd input{
    background: none;
}
.order_btn{
    position: relative;
    padding-bottom: 50px;
}
.order_btn a{
    margin-left: 170px;
}
.order_edit.labelwidth dl dt{
    width: 100px;
}
.order_edit.labelwidth dl dd{
    width: 400px;
}
.order_btn.labelwidth a{
    margin-left: 190px;
}