@media only screen and (max-width: 768px){

    img {

        margin-bottom: 0;

    }

    .content_boxs {

        padding-top: 32px;

    }

    .big_top {

        padding: 48px 0 32px 0;

    }
}
@media only screen and (max-width: 767px){
    .materials_ti h1{
        font-size: 24px!important;
        line-height: 36px!important;
    }
}

@media only screen and (min-width: 768px){

    .content_boxs {

    padding-top: 80px;

    }

    .big_top {

        padding: 48px 0 80px 0;

    }

}

@media only screen and (min-width: 1200px) and (max-width: 1370px){

    .container {

        width: 98%;

        margin: 0 auto;

    }

    }

/* 顶部 */

.materials_ti {

    color:rgba(255,255,255,1);
    position: relative;

}

.subject a {

    font-size:12px;


    color:rgba(255,255,255,1);

}

.ti_introduce {
    font-size:14px;
    color:#ffffff96;
    margin-top: 24px;

}

.materials_ti {

    background: linear-gradient(to right, #FF5980, #FFA882);
    background:-webkit-linear-gradient(to right, #FF5980, #FFA882); 
    background:-moz-linear-gradient(to right, #FF5980, #FFA882);
    background:-o-linear-gradient(to right, #FF5980, #FFA882); 
    background:-ms-linear-gradient(to right, #FF5980, #FFA882); 
    
}
.materials_ti h1 {
    font-size:40px;
    font-weight:400;
    color:rgba(255,255,255,1);
    margin-top: 16px;
    line-height: 56px;
}

.ti_list {

    width: 100%;

    height: 24px;

    margin-top: 40px;

}

.ti_list ul {

    height: 100%;

    display: box;              /* OLD - Android 4.4- */
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */

     /* 09版 */
     -webkit-box-orient: horizontal;
     /* 12版 */
     -webkit-flex-direction: row;
     -moz-flex-direction: row;
     -ms-flex-direction: row;
     -o-flex-direction: row;
     flex-direction: row;
    /* 09版 */
    -webkit-box-pack: flex-start;
    /* 12版 */
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -ms-justify-content: flex-start;
    -o-justify-content: flex-start;
    justify-content: flex-start;

    /* 09版 */
    -webkit-box-align: center;
    /* 12版 */
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;

     /* 09版 */
     -webkit-box-lines: multiple;
     /* 12版 */
     -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
     -ms-flex-wrap: wrap;
     -o-flex-wrap: wrap;
     flex-wrap: wrap;

}

.ti_list li {

    margin-right: 36px;

    display: flex;

    flex-direction:row;

    justify-content:flex-start;

    align-items:center;

    padding: 4px 0;

}

.ti_list span {

    margin-left: 8px;

}

.ti_list a {

    font-size:12px;

    font-weight:400;

    color:rgba(255,255,255,1);
    
    opacity: 0.5;

}
.materials_txt {
    position: absolute;
    top: 88px;
    z-index: 2;
}
.materials_bg {
    width: 100%;
    height: 100%;
}
.materials_bg .materials_bg_img {

    max-width:100%;
    height: 420px;
    opacity: 0.05;
    z-index: 1;
}
.materials_txts {
    position: relative;
}
@media only screen and (max-width: 768px){
    .materials_txtBox {
        padding: 0 12px;
        top:68px;
    }
    .materials_ti {   
        height: 360px; 
    }
    .ti_introduce {
        width:100%;
    }
    .materials_bg .materials_bg_img {
    max-width:100%;
    height: 360px;
    opacity: 0.05;
    z-index: 1;
}

}

@media only screen and (min-width: 768px){

    .materials_ti {

        margin-top: 60px;
        height: 420px;

    }

    .ti_introduce {

        width:648px;

    }

}

h2, .h2 {
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    margin-top: 60px!important;
    margin-bottom: 26px!important;
    line-height: 140%;
}
h3, .h3 {
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    margin-top: 60px!important;
    margin-bottom: 26px!important;
    line-height: 140%;
}
h4, .h4, h5, .h5, h6, .h6 {
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    margin-top: 60px!important;
    margin-bottom: 26px!important;
    line-height: 140%;
}

/* 内容区域 */

.particulars_content a{
    text-decoration: none;
    border-bottom: 1px solid #ffc81f;
    color: #4c4e4d;
    padding-bottom: 4px;
    -webkit-transition: all .2s;
    transition: all .2s;
}
.particulars_content a:hover{
    border-bottom: 2px solid #ffc81f;
    transition: box-shadow .2s linear;
    box-shadow: inset 0 -10px #ffc81f;
}

.tuwen_title:hover {
    color: #FD3554;
}

.fodder-box-img {
    height:224px;
    border-radius:8px;
}
.particulars_box {
    padding-top: 40px;
    background-color: #fff;
}

.content_box {

    position: relative;

}

.top_operation {

    width: 40px;

    position: absolute;

    top: 0;

    left: 0;

}

.top_operation ul {

    display: flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

}

.top_operation li {

    margin-bottom: 8px;

    font-size:12px;

    

    font-weight:400;

    color:rgba(140,140,140,1);

}
.top_operation li {
    width:40px;
    height:40px;
    border-radius: 50%;
    text-align: center;
    overflow: hidden;
}
.top_operation li a {
    display: block;
    width: 100%;
    height: 100%;
}
.top_operation li:hover img {
    
}

.top_operation li:nth-child(2) {
    border: 1px solid #D7D7D7;
}

.top_operation li:nth-child(2):hover,.wait_list span a:hover {
    border-color: #8c8c8c;
}

.top_operation li img  {

    width:22px;
    height:22px;
    margin:0px auto;
    display:table;
    margin-top: 9px;

}

.particulars_content img {

    max-width: 100% ;
    height: auto;

}
.particulars_content p {
    width: 100%;
}
.source_ul {

    margin: 80px 0 56px 0;

}

.source_ul ul {

    display: flex;

    flex-direction:row;

    justify-content:flex-start;

    align-items:center;

    flex-wrap:wrap;

}

.source_ul li {

    padding: 8px 0;

}

.source_ul li a {

    padding: 8px 16px;

    border-radius:8px;

    border:1px solid #D7D7D7;

}

.source_ul a {

    font-size:12px;

    

    font-weight:400;

    color:rgba(140,140,140,1);

}
.source_ul li a:hover {
    background-color: #D7D7D7;
    color: #202020FF;
}

.more_operation {

    display: flex;

    flex-direction:row;

    align-items:center;

    flex-wrap:wrap;

    margin-bottom: 80px;

}

.wait_list span a {

    width:40px;
    height:40px;
    display: inline-block;
    border:1px solid #D7D7D7;
    border-radius: 50%;
    margin: 0 16px 0 0;
    overflow: hidden;

}
.wait_list span a img {
    display:table;
    margin:0 auto;
    margin-top: 8px;
}
.wait_list img {

    width: 24px;

    height: 24px;

}
.share_list a {
    width:40px;
    height:40px;
    line-height: 34px;
    text-align: center;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
}
.share_list img {

    

}
.share_list span:nth-child(1) a {


    background-color: #3FC663;

    border:1px solid #3FC663;

}

.share_list span:nth-child(2) a {


    background-color: #E82D20;

    border:1px solid #E82D20;

}

.share_list span:nth-child(3) a {


    background-color: #40B7F6;

    border:1px solid #40B7F6;

}

.share_list span:last-child a {

}
.share_list span:last-child img {
}
.appreciate {

    margin-top: 80px;

    margin-bottom: 36px;

}

.fodder-box {

    background-color: #F6F6F6;    
    box-shadow: none !important;
}       
.fodder-box {
    background-color: #f9f7f6;
    box-shadow: none;
    -webkit-transform: none;
    transform: none;
    cursor: default;
}
.fodder-box:hover .fodder-operation {
    opacity: 0;
 }
 .fodder-box .fodder-operation:hover {
    opacity: 0.8;
    cursor: pointer;
} 
.fodder-box-title a:hover {
    color: #ff1053;
}
.fodder-box-author a {

    font-size:12px;

    

    color:rgba(140,140,140,1);

}

.fodder-box:hover{ 

    box-shadow: none;

    -webkit-transform: none;

    transform: none; 

  }

  .comment {

      background-color: #fff;

      padding: 80px 0;

  }

  .comment h3 {

    font-size:34px;

    font-weight:400;

    color:rgba(32,32,32,1);

  }

  .comment_ul {

      margin-top: 32px;

  }

  .comment_input {

      width: 100%;

      padding: 24px;

      border-radius:8px;

      border:1px solid #D7D7D7;

      display: flex;

      flex-direction:row;

      justify-content:flex-start;

  }

  .comment_input img {

      width: 40px;

      height: 40px;

      margin-right: 20px;

  }

  .comment_input textarea {

    font-size:17px;

    

    color:rgba(140,140,140,1);

    resize:none;

  }

  .comment_ul ul {



  }

  .comment_ul li {

    margin-top: 32px;

    width: 100%;

    padding: 24px;

    display: flex;

    flex-direction:row;

    justify-content:flex-start;

    border-radius:8px;

    border:1px solid #D7D7D7;

}

.comment_ul li .evaluate_img {

    width:40px;

    height:40px;

    border-radius: 50%;

}

.evaluate_name a {

    font-size:14px;

    

    font-weight:500;

    color:rgba(32,32,32,1);

}

.evaluate_timer {

    font-size:12px;

    

    font-weight:500;

    color:rgba(194,194,194,1);

}

.evaluate_txt {

    width:82%;

    font-size:12px;

    

    font-weight:500;

    color:rgba(164,164,164,1);

    word-wrap:break-word;

    margin-top: 8px;

}

.evaluate_operation {

    margin-top: 8px;

    font-size:12px;

    

    font-weight:400;

    color:rgba(140,140,140,1);

}

.evaluate_operation span {

    margin-right: 16px;

}

.evaluate_operation img {

    margin-right: 8px;

}

.evaluate_box {

    margin-left: 16px;

}

@media only screen and (max-width: 768px){

    .particulars_content {

        width: 96%;

        margin: 0 auto;

    }

    .bottom_operation {

        width: 96%;

        margin: 0px auto;

    }

    .source_ul li {

        margin: 0 8px;

    }
    .source_ul li:hover {
        background-color: #D7D7D7;
        color: #202020;
    }
   .top_operation {

    display: none;

   }

   .top_operation li:hover img {
    display: inline-block;
    filter: drop-shadow(#8c8c8c 80px 0px);
    overflow: hidden;
    left: 80px;
    position: relative;
   }

   .more_operation {

    justify-content:flex-start;

}

.share_list img {

    margin:  8px;

}

.wait_list span div {

    margin:  8px;

}

}

@media only screen and (min-width: 768px){

    .particulars_content {

        width: 67%;

        margin: 0 auto;

    }

    .bottom_operation {

        width: 67%;

        margin: 0px auto;

    }

    .source_ul li {

        margin: 0 24px 0 0;

    }

    .top_operation {

        display: block;

    }

    .more_operation {

        justify-content:space-between;

    }

    .share_list img {

    }

    .wait_list img {

        

    }

}

/* 底部 */

.vip_box_index {

    background-color: #fff;

}
/* 推荐 */
.fodder-box-bagimg {
    height: 224px;
    border-radius: 8px;
}
.fodder-box-author {
    margin-left: 0px;
}
.fodder-box-title {
    margin-left: 0px;
}
.fodder-titles {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
}