updata css

data/resource/mobile/ugc/css/main.css

@@ -14,10 +14,8 @@ time, mark, audio, video {
   padding: 0;
   border: 0;
   outline: 0;
-  font-size: 100%;
   vertical-align: baseline;
-  background: transparent;
-  -webkit-transition: all .5s ease-out; }
+  background: transparent; }
 
 body {
   line-height: 1; }
@@ -88,18 +86,18 @@ body {
   padding-right: 50px;
   font-family: "PingFang SC Light", "Heiti SC";
   color: #000000;
-  padding-bottom: 200px; }
+  padding-bottom: 100px; }
 
 img {
   width: 100%; }
 
-.title, .thumbnail .thumbnail_image, .comment .comment_list, .comment .comment_list .comment_item, .comment .comment_list .comment_item .subject .subject_name, .vote .vote_options, .vote .vote_options .vote_option, .vote .results .result .status .status_line {
+.title, .thumbnail, .thumbnail .thumbnail_image, .comment .comment_list, .comment .comment_list .comment_item, .comment .comment_list .comment_item .subject .subject_name, .vote .vote_options, .vote .vote_options .vote_option, .vote .results .result .status .status_line {
   position: relative; }
 
 .bottom_flex {
   position: fixed; }
 
-.title span.br, .thumbnail .thumbnail_image .play_icon, .comment .comment_list .br, .comment .comment_list .comment_item .br, .vote .vote_options .vote_option:after, .vote .results .result .status .status_line .stat, .vote .results .result .status .status_line .status_bg {
+.title span.br, .thumbnail .play_icon, .thumbnail .thumbnail_image .play_icon, .comment .comment_list .br, .comment .comment_list .comment_item .br, .pop .answer_comments, .vote .vote_options .vote_option:after, .vote .results .result .status .status_line .stat, .vote .results .result .status .status_line .status_bg {
   position: absolute; }
 
 .bonus_icon {
@@ -108,7 +106,7 @@ img {
 .comment .pro .pro_title, .comment .comment_list .comment_item .subject .subject_box, .comment .comment_list .comment_item .subject .subject_image, .comment .comment_list .comment_item .subject .subject_name, .pop .handle .close, .vote .vote_pro .vote_question {
   float: left; }
 
-.comment .comment_list .comment_item .subject .link, .pop .handle .submit, .vote .vote_pro .vote_type {
+.comment .comment_list .comment_item .subject .like, .pop .handle .submit, .vote .vote_pro .vote_type {
   float: right; }
 
 .comment .pro, .comment .comment_list .comment_item .subject, .pop .handle, .vote .vote_options .vote_option, .vote .vote_pro {
@@ -130,7 +128,7 @@ img {
   left: 0; }
 
 .author h4 {
-  font-size: 32px;
+  font-size: 36px;
   padding-top: 23px;
   font-weight: normal; }
 
@@ -146,6 +144,15 @@ article {
 .thumbnail video {
   width: 100%;
   height: 380px; }
+.thumbnail .play_icon {
+  background: url("../images/play_icon.png") no-repeat;
+  background-size: 100%;
+  width: 108px;
+  height: 108px;
+  left: 50%;
+  top: 50%;
+  margin-left: -54px;
+  margin-top: -84px; }
 .thumbnail .thumbnail_image .play_icon {
   background: url("../images/play_icon.png") no-repeat;
   background-size: 100%;
@@ -205,11 +212,13 @@ article {
 .comment .comment_list .comment_item .subject .subject_name .time {
   color: #9B9B9B;
   font-size: 22px; }
-.comment .comment_list .comment_item .subject .link .link_num {
+.comment .comment_list .comment_item .subject .like .like_btn.active .like_num {
+  color: #F95858; }
+.comment .comment_list .comment_item .subject .like .like_num {
   font-size: 24px;
   color: #9B9B9B;
   padding-right: 15px; }
-.comment .comment_list .comment_item .subject .link .like_icon_null {
+.comment .comment_list .comment_item .subject .like .like_icon_null {
   width: 32px;
   height: 30px;
   vertical-align: bottom; }
@@ -221,33 +230,41 @@ article {
   left: 0; }
 
 .pop {
-  display: none;
   position: fixed;
   left: 0;
   top: 0;
+  display: none;
   width: 100%;
   height: 100%;
-  background: rgba(0, 0, 0, 0.8);
-  z-index: 99;
+  background: rgba(0, 0, 0, 0.3);
+  z-index: 1000;
   font-size: 28px; }
+.pop .answer_comments {
+  width: 100%;
+  bottom: 10px;
+  left: 0; }
 .pop .msg_num {
-  font-size: 24px; }
+  font-size: 24px;
+  height: 30px;
+  background: #fff;
+  text-align: right; }
 .pop .msg_num p {
+  height: 40px;
+  line-height: 40px;
   text-align: right;
-  padding-right: 20px; }
+  padding-right: 20px;
+  background: #fff; }
 .pop .comments_box {
-  width: 100%; }
+  width: 100%;
+  height: 280px;
+  background: #fff; }
 .pop .comments_box .comments {
   width: 710px;
-  height: 280px;
+  height: 242px;
   padding: 20px;
   border: none;
   resize: none;
   font-size: 28px; }
-.pop .comments_box .msg_num {
-  height: 60px;
-  background: #fff;
-  text-align: right; }
 .pop .handle {
   background: #fff;
   font-size: 28px; }
@@ -327,6 +344,8 @@ article {
   width: 380px;
   vertical-align: middle; }
 .vote .results .result .status .status_line .stat {
+  transition: width 0.5s ease-out;
+  -webkit-transition: width 0.5s ease-out;
   left: 0;
   top: 10px;
   width: 0;
@@ -363,6 +382,7 @@ article {
   background: #C7C7C7; }
 
 .bottom_flex {
+  z-index: 999;
   font-size: 24px;
   bottom: 0;
   left: 0;