/*@charset "UTF-8";*/
/**
   * 公用
   * @authors fl
   * @date    2019-06-12 15:40:13
   * @version v1.0
   */
/*base*/
* {
    margin: 0;
    padding: 0;
}
html，body{font-size:10px;}
#swipebox-container { touch-action: pan-y;}

a {
    text-decoration: none;
}

body {
    font-family: "Microsoft Yahei", Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #222;
    overflow-x: hidden;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
input,button{
    outline:none;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}
img {
    border: 0;
}

.img {
    width: 100%;
    height: 100%;
    object-fit:cover;
}

.imga {
    width: 100%;
    height: auto;
}

.block-a {
    display: block;
    text-decoration: none;
}

.bar {
    width: 100vw;
    height: 2.8vw;
    background-color: #f0f0f0;
}
.hide {
    display: none;
}
/*头部*/
.header {
    box-sizing: border-box;
    padding: 0 5.2vw;
    width: 100vw;
    height: 13.4vw;
    background-color: #ffd801;
    background-image: url('//www.xiaokeai.com/statics/mindex/images/topbg.png');
    background-size: 62px 50px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.header-logo {
    padding-top: 3.3vw;
    width: 18vw;
}

.header-tabs {
    width: 30vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-taba {
    width: 13vw;
    height: 6.4vw;
    line-height: 6.4vw;
    text-align: center;
    font-size: 3.5vw;
    color: #fff;
    background-image: url('//www.xiaokeai.com/statics/mindex/images/abg.png');
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.header-tab {
    width: 13vw;
    height: 6.4vw;
    line-height: 6.4vw;
    text-align: center;
    font-size: 3.5vw;
    color: #222;
    cursor: pointer;
}

.header-search {
    padding: 0 2.4vw;
    height: 5.4vw;
    line-height: 5.4vw;
    font-size: 3.5vw;
    color: #222;
    text-align: center;
    box-shadow: 0px 0.1rem 0.1rem 0px rgba(253, 162, 0, 0.5);
    background-color: #ffee95;
    border-radius: 2.7vw;
    border: 2px solid #fdb900;
}

.header-tabs,
.header-search {
    margin: 2vw 0 0 0;
}

.header-search a {
    color: #291e18;
}
.header-title{
    width: 100%;
    font-size: 5.33vw;
    font-weight:500;
    position: absolute;
    left: 0;
    text-align: center;
    z-index: -1;
}
.header-menu{
    display: flex;
    align-items: center;
}
.header-menu a{
    display: block;
    width: 5.4vw;
    height: 13.4vw;
}
.header-menu .search_icon{
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/seas.png') no-repeat center center;
    background-size: 3.6vw auto;
    margin:0 4vw 0 0;
}
.header-menu .dot_icon{
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/dot.png') no-repeat center center;
    background-size: 5.33vw auto;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    transition: all .5s;
}

/*下拉菜单*/
.xlmenu {
    position: fixed;
    left: 0;
    right: 0;
    top: 13.4vw;
    bottom: 0;
    overflow: hidden;
    z-index: 10;
    font-size: 3.466vw;
    display: none;
}

.xlfade {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.xlmenu-list {
    background-color: #222;
    padding: 0 0 4vw 5.33vw;
    max-height: 100%;
    overflow-y: auto;
    position: relative;
}

.xlmenu-list .first {
    padding: 5.33vw 0 1.33vw 0;
    border-bottom: 1px solid #444;
    margin-right: 5.33vw;
    margin-bottom: 5.33vw;
}

.xlmenu-list .first dt {
    float: left;
    line-height: 8vw;
    margin-bottom: 0;
    margin-right: 1.73vw;
}

.xlmenu-list .first dd a {
    width: 17.6vw;
    background-image: url('//www.xiaokeai.com/statics/mpet/skin_img/xllibg.png');
}

.xlmenu-list .first dd a.on {
    color: #222;
    background-image: url('//www.xiaokeai.com/statics/mpet/skin_img/xllibg_on.png');
}

.xlmenu-list dl {
    padding-top: 1.33vw;
}

.xlmenu-list dt {
    color: #ccc;
    margin-bottom: 2vw;
}

.xlmenu-list dt .all {
    float: right;
    font-size: 3.2vw;
    color: #ccc;
    position: relative;
    padding-right: 2.13vw;
    margin-right: 5.33vw;
    line-height: 4vw;
}

.xlmenu-list dt .all:after {
    display: block;
    content: '';
    width: 1.46vw;
    height: 2.26vw;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/all.png');
    background-size: 100% 100%;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -0.93vw;
}

.xlmenu-list dd a {
    display: inline-block;
    width: 20.2vw;
    line-height: 8vw;
    height: 8vw;
    text-align: center;
    color: #999;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/xlabg.png') no-repeat center;
    background-size: 100% 100%;
    margin: 0 1.73vw 4vw 0;
}

.cover-menu {
    position: fixed;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.cover-menu .xlmenu {
    display: block;
}

.cover-menu .dot_icon {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
/*搜索头部*/
.header .searbox {
    width: 50vw;
    height: 8vw;
    position: absolute;
    left: 25%;
    bottom:0;
    top: 0;
    margin: auto;
    border-radius: 46px;
    background-color: #ffee95;
    box-shadow: 0px 0.1rem 0.1rem 0px rgba(253, 162, 0, 0.3);
    overflow: hidden;
    display: flex;
}
.header .searbox span {
    float: left;
    width: 3.73vw;
    height: 3.73vw;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/icon_search.png');
    background-size: 100% 100%;
    margin:auto 2.66vw;
}
.header .searbox input{
    border:0;
    background: none;
    line-height: 3.73vw;
}
.header .search_btn{
    font-weight: bold;
    font-size: 3.77vw;
    border:0;
    background: none;
}
/*底部*/
.footer {
    box-sizing: border-box;
    width: 100vw;
    height: 9.4vw;
    background-color: #ffd801;
    background-image: url('//www.xiaokeai.com/statics/mindex/images/topbg.png');
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 2.4vw;
    color: #222;
}

.footer .ptxt span {
    margin: 0 1.33vw;
}
.footer .ptxt {
    text-align: center;
}

/*gotop*/
.fix-menu {
    position: fixed;
    right: 0;
    bottom: 20vw;
    width: 22vw;
    /*height: 12vw;*/
    line-height: 0;
    text-align: center;
    /*background-color: #ffd801;*/
    z-index: 9999;
    display: none;
}

.gototop {
    display: contents;
    width: 4.3vw;
    height: auto;
}
.gofirst {
    display: inline-block;
    width: 4.3vw;
    height: auto;
}
 .godown {
    display: inline-block;
    width: 4.3vw;
    height: auto;
}



/*tab栏*/
.tabs {
    box-sizing: border-box;
    width: 100vw;
    white-space: nowrap;
    text-align: justify;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    background-color: #fff;
    height: 10.66vw;
    line-height: 10.66vw;
    font-size: 4.53vw;
    -moz-box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    border: 0;
    margin: 0 0 1.066vw 0;
    padding: 0 0 0 5vw;
}
.tabs .taba, .tabs .tab {
    line-height: 11vw;
    margin: 0 6.6vw 0 0;
    font-weight: 500;
    font-size: 4.3vw;
    color: #222;
}
.tabs .taba {
    color: #FFBD00;
    font-size: 4.53vw;
}
/*标题*/
.content-header {
    width: 100vw;
    height: 12.8vw;
    box-sizing: border-box;
    padding: 0 5vw;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px solid #e2e2e2;
}
.content-title {
    font-weight: 400;
    font-size: 5.33vw;
    position: relative;
    color: #222;
    z-index: 2;
}
.content-title::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2.8vw;
    left: 2vw;
    bottom: -.4vw;
    background: -webkit-linear-gradient(90deg,rgba(255,191,15,1) 0%,rgba(255,235,50,1) 100%);
    background: -moz-linear-gradient(90deg,rgba(255,191,15,1) 0%,rgba(255,235,50,1) 100%);
    background: linear-gradient(90deg,rgba(255,191,15,1) 0%,rgba(255,235,50,1) 100%);
    z-index: -1;
}
.content-title.content-title-tabs::before{
    background: none;
}
.content-title-tabs span{
    margin-right: 8vw;
    padding:0 1.33vw;
    position: relative;
}
.content-title-tabs span.cur{
    color:#FFBD00;
}
.content-title-tabs span.cur::after{
    content: '';
    position: absolute;
    bottom:-3vw;
    left: 0;
    width: 100%;
    height: 0.53vw;
    background: #FFBD00;
}
/*列表*/
.content-box{
    width: 100vw;
    background-color: #fff;
}
.content-items {
    padding: 0 5vw;
    width: 100%;
    box-sizing: border-box;
}
.new-title {
    line-height: 6.66vw;
    font-size: 4.53vw;
    color: #222;
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.new-imgs {
    padding: 0vw 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.new-img {
    width: 28.8vw;
}
.new-right,.new-left,.new-img {
    height: 20.8vw;
}
.new-msg {
    line-height: 5.33vw;
    width: 100%;
    height: 6vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.new-look {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
.new-msg .new-origin, .new-msg .new-time, .new-msg .new-valumn {
    font-size: 3.733vw;
    color: #aaa;
}
.new-origin {
    margin-right: 3vw;
    max-width: 22vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.new-eye {
    line-height: 0;
    width: 5.3vw;
    margin-right: 1vw;
}
/*上下结构*/
.content-itemb {
    padding: 4vw 0 2.66vw 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    border-bottom: 1px solid #e2e2e2;
}
.content-itemb .new-msg .new-look:first-child {
    width: 57%;
    justify-content: space-between;
}
/*左右结构*/
.content-itema {
    padding: 5.33vw 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e2e2e2;
}
.content-itema .new-left {
    width: 57vw;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}
.content-itema .new-right {
    width: 28.8vw;
}
/*更多提示*/
.content-btnsa {
    width: 100%;
    height: 13vw;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.content-btn {
    width: 44vw;
    height: 8vw;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.content-btn-title {
    line-height: 4vw;
    font-size: 4vw;
    color: #ffd801;
    margin-right: .5vw;
}
.content-btn-icon {
    width: 4vw;
    height: 4vw;
}
.content-btn-icon img {
    display: block;
}
/*两列更多提示*/
.content-btns {
    width: 100%;
    height: 13vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.content-btns-line {
    width: 1px;
    height: 8vw;
    background-color: #e2e2e2;
}
/*当前位置*/
.content-position{
    height: 10.66vw;
    line-height: 10.66vw;
    -moz-box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0.266vw 0.8vw 0px rgba(0, 0, 0, 0.05);
    margin: 0 0 1.066vw 0;
    padding:0 5vw;
    font-size: 4.26vw;
}
.content-position a,.content-position span{
    display: inline-block;
}
.content-position a{
    color: #222;
}
.content-position span{
    color:#999;
    position: relative;
    padding-left: 9.86vw;
}
.content-position span::before{
    content: '';
    position: absolute;
    position: absolute;
    width: 9.86vw;
    height: 100%;
    left: 0;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/arrow-right.png') no-repeat center center;
    background-size: auto 100%;
}
/*关注公众号*/
.gzgzh-btn{
    text-align: center;
    padding-bottom: 8vw;
}
.gzgzh-btn b{
    display: block;
    font-size: 4.53vw;
    color: #333;
    font-weight:500;
    padding:8vw 0 4vw 0;
}
.gzgzh-btn a{
    display: block;
    height: 11.7vw;
    margin: 0 auto;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/gzbtn.png?V=2') no-repeat center center;
    background-size: auto 100%;
}
.cover-gzh .gzhfade, .cover-gzh .pop-gzh {
    display: block;
}
.gzhfade {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: none;
    z-index: 3;
}
.pop-gzh {
    position: fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    width: 89.3vw;
    height: 146.6vw;
    margin: auto;
    display: none;
    z-index: 4;
    border-radius: 8vw;
}
.pop-gzh img {
    width: 100%;
}
.pop-gzh .gzhclose {
    width: 8.8vw;
    height: 8.8vw;
    right: -3.2vw;
    top: -3.2vw;
    background: url('//www.xiaokeai.com/statics/mpet/skin_img/gzhclose.png?V=1') no-repeat;
    background-size: 100% 100%;
}
.pop-gzh .copybtn {
    width: 70.6vw;
    line-height: 12vw;
    text-align: center;
    background-color: #ffbc00;
    font-size:4.53vw;
    color: #fff;
    bottom:6.66vw;
    border-radius: 100px;
    letter-spacing: 1px;
    left: 50%;
    margin-left: -35.3vw;
}
.pop-gzh a {
    display: block;
    position: absolute;
}
.image {
    position: relative;
    width: 100%;
    padding-top: 50%;
}

.img-style{
    list-style: none;
    width: 100%;
    height: 100%;
    display: block;
}
.box {
    width: 100%;
    position: relative;
    overflow: hidden;
}
@media screen and (min-width:320px)  {
    .box {
        width: 100%;

        position: relative;

    }
}
@media screen and (min-width:375px)  {
    .box {
        width: 100%;

        position: relative;

        object-fit:cover;
    }
}
@media screen and (min-width:768px) {
    .box {
        width: 100%;

        position: relative;

    }
}
@media screen and (min-width:1024px) {
    .box {
        width: 100%;

        position: relative;

        overflow: hidden;
    }
}


.image li{
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    position: absolute;
    display: none;
}

.num{
    position: absolute;
    list-style: none;
    cursor: pointer;
    bottom: 20px;
    left: 0;
    width: 30%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 35%;
}
.num li{
    float: left;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background-color: gray;
    margin: 0 4px;
    text-align: center;
    line-height: 20px;
}
.num .current{
    background-color: red;
}