body,h1,h2,h3,h4,h5,h6,h7,p,dl,dd,dt,form,ul,li,div { box-sizing: border-box; }

body { font-family:Arial; color:#222; }

.container { margin:0 10px; }

:root {
    --green: #2ECC71;
    --deepgreen: #1d8246;
    --gray: #ebebeb;
}

.flex-wrap { display: flex; flex-wrap: wrap; justify-content: flex-start; }
.col-xs-1 { flex: 1; }
.col-xs-2 { flex: 2; }
.col-xs-3 { flex: 3; }
.col-xs-4 { flex: 4; }
.col-xs-5 { flex: 5; }
.col-xs-6 { flex: 6; }

.maintitle { font:bold 18px/1 "Microsoft YaHei"; padding:10px 0; text-align:center; }

.tongji { background:none; border-radius:4px }
.tongji ul { height:52px; border-radius:4px; background:#2ECC71; }
.tongji li { border-left:1px solid #fff; }
.tongji li:nth-child(1) { border-left:0px; }
.tongji li, span { color:#fff; font-weight:normal; font-family:Arial; }

#top10 { margin-top: 10px; }
#top10 h4 { margin: 10px 0; }
#top10 ul { width: 2000vw; height: 10vw; display: flex; position: relative; }
#top10 li { width: 10vw; height: auto; aspect-ratio: 1; position: absolute; transition:left 1s; }
#top10 li img { width: 100%; height: 100%; border: 1px solid #eee; object-fit: cover; }

.nav { display: flex; }
.nav li { flex: 1; }

/**index**/

.masonry { width: 100%; column-count: 2; column-gap: 10px; }
.masonry li { width: 50%; }

.introduce li { min-height:35px; }
.introduce .info { overflow:hidden; text-overflow:ellipsis; white-space: nowrap; }

.w-index-search .search-input-wrap input {
    border: 1px solid #2ECC71;
}
.list_box .picCon { width:100%; box-sizing: border-box; break-inside: avoid; }
.list_box .picCon img { width:100%; }
.list_box .picCon .avatar { width:100%; height: auto; aspect-ratio: 1; }
.list_box .picCon .avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover; /*根据父容器的尺寸裁剪和缩放图片，以填充整个容器，并保持长宽比例不变。*/
    object-position: center; /*指定对象的位置，如果不设置，则默认是center*/
    background-size: cover; /*背景图片的大小，如果不设置，则默认是auto*/
    background-position: center;
}

.catalog { margin:0 10px; clear: both; }
.catalog a { background:#fff; padding:2px; border-radius:5px; border-bottom:2px solid #ccc; margin:2px 2px; }
.catalog a.on { background:#06C; color:#fff; }

.search-suggestion { width: calc(100% - 12px); position: absolute; background-color: #fff; border: 1px solid #2ECC71; border-top:0px;
    display: flex; flex-wrap: wrap; z-index: 2; }
.search-suggestion li { width: 33.3%; line-height: 30px; text-align: center; }

.btn-block { width: 100%; height: 35px; margin:0 auto; border-radius:4px; font-size:16px; }
.btn-default { text-indent:1em; border-bottom:2px solid #ccc; }
.btn-primary { background-color:#2B9ACF; border-bottom:2px solid #0A76A7; color:#fff; margin-top:5px; }
.btn-success { background-color:var(--green); border-bottom:2px solid var(--deepgreen); color:#fff; margin-top:5px; }
.btn-white { text-align: center; background-color: #fff; border-bottom: 1px solid #999; padding: 2px 5px; margin: 0 5px;
    border-radius: 3px; }

.video { background-color: #ccc; }

.btns{ display: flex; }
.btns a { width: auto; flex: 1;}


/******** 内容页 item */
.liuyan { padding: 0 15px;}
.lypl {  color: #D3DAAF; font-size: 15px; line-height: 1.5em; }
.detail .item img { margin-top: 5px; }
.detail .item h6 { color: #222; text-align: center; font-size: 14px; }

.pages { display: flex; flex-wrap: wrap; color: #fff; }
.pages .btn-inline { width: 33.3%; line-height: 30px; text-align: center; background-color: var(--green); border-right: 1px solid #fff; }
.pages .btn-left { border-right: 1px solid #fff; border-radius: 5% 0 0 5%; }
.pages .btn-right { border-radius: 0 5% 5% 0; }

.paihang ul li {
    clear: both;
}

.w-index-search .search-input-wrap {
    background: none repeat scroll 0% 0% #FFF;
    position: relative;
    width: 100%;
    height: 35px;
    overflow: hidden;
}

.w-index-search .search-input-wrap input {
    display: block;
    height: 100%;
    width: 100%;
    box-shadow: none;
    color: #303030;
    padding: 0px 0px 0px 10px;
    border: 1px solid #2ECC71;
    box-sizing: border-box;
}
input, textarea {
    border-radius: 0px;
}
button, input, select, textarea {
    font-family: inherit;
    font-size: 100%;
    vertical-align: middle;
}
.w-index-search .search-input-wrap button {
    cursor: pointer;
    display: block;
    width: 49px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    text-indent: -9999px;
    overflow: hidden;
    border-width: 0px 0px 0px 1px;
    border-style: none none none solid;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    background-image: url("http://newebapp2.nuomi.bdimg.com/static/list/widget/index_search/img/icon-search_6d482fd.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 17px 17px;
    border-color: -moz-use-text-color -moz-use-text-color -moz-use-text-color rgb(65, 212, 87);
    background-color: #2ECC71;
}
button, input, select, textarea {
    font-family: inherit;
    font-size: 100%;
    vertical-align: middle;
}

/** 我的投稿页 */
.item-label { color: #444; }
.imgSelect {opacity:0.5 }
.msg { color: #E1AF6E; }
.input { width:100%; padding:10px 0 ; margin: 5px 0; border:1px solid #dcdcdc; border-radius:4px;
    background-color: #fff;color: #000000;font-size:16px; }
.uploads { display: flex; flex-wrap: wrap }
.upload { width: 33.3%; padding: 1%; position: relative; }
.upload img { border: 1px solid #fff; }
.upload .check { position: absolute; left: 10px; top: 10px; width: 18px; height: 18px; }
.upload .title { width: 100%; background-color: #fff; color: darkgrey; margin: 2px; }
.upload .del { color: red }
.upload .left { position: absolute; left: 10px; top: 10px; background-color: #fff; padding: 0px 5px; border-radius: 3px; }
.upload .focus { border: 1px solid red; }
.upload .tips { position: absolute; left: 8px; top: 6px; font-width: bold; display: flex; }
.upload span { color: red; margin-right: 3px; text-shadow: 1px 1px #000000; }

.reg-header { padding: 3px 0; text-align: center; background-color: var(--green); border-bottom: 1px dashed var(--gray); }
.btn-preview { display: block; line-height: 35px; text-align: center; text-indent: 0em; }
.btn-upload { padding-left: 0; text-align: center; background-color:orange; border-bottom:2px solid orangered; color: #fff; }
.btn-upload label { display: block; line-height: 30px;}
.btn-upload input {display: none;}
.applys { margin: 10px 0; }
.picOp { display: flex; margin: 10px 0; }
.picOp div { }

#cropCanvas { background-color: #fff; }
#cropper {  }
#cropper .screen { height: 400px; }
#cropper .ops { margin-top: 20px; }

/** 查看报名表 */
.viewregs td { padding-top: 20px; }
.viewregs .regpics { display: flex; flex-wrap: wrap; }
.viewregs .regpics div { width: 33.3%; }
.viewregs .regpics div img { width: 100%; }
.viewregs p { text-indent: 2em; }
.viewregs h4 { margin: 10px 0; }
.viewregs .albums { width: 100%; }
.viewregs .albums img { width: 100%; }

/** 排行榜 */
.rank div { text-align: center; display: flex; flex-direction: column;
    justify-content: center; }

/** 打分页 */
.mark-selects { width:100%; display: flex; }
.mark-selects .item { flex: 1; text-align: center; }
.mark-selects .item select { width: 100%; }

@media (max-width: 640px) {
  .list_box .picCon{ }
}