diff --git a/pages.json b/pages.json
index 0502b99..fa3e7c9 100644
--- a/pages.json
+++ b/pages.json
@@ -145,7 +145,8 @@
 			"style" : 
 			{
 				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
+				"enablePullDownRefresh" : false,
+				"navigationStyle": "custom"
 			}
 		},
 		{
@@ -153,7 +154,8 @@
 			"style" :
 			{
 				"navigationBarTitleText" : "",
-				"enablePullDownRefresh" : false
+				"enablePullDownRefresh" : false,
+				"navigationStyle": "custom"
 			}
 		}]
 	}],
diff --git a/static/base_css.css b/static/base_css.css
index 221919e..81791fb 100644
--- a/static/base_css.css
+++ b/static/base_css.css
@@ -47,7 +47,7 @@ img {
 	z-index: 9999;
 	padding: 0 5%;
 	width: 100%;
-	height: 45px;
+	height: 90rpx;
 	color: #fff;
 	line-height: 30px;
 	background-color: #bac6fc;
@@ -58,9 +58,9 @@ img {
 
 
 .mainwrap {
-	margin-top: 40px;
+	margin-top: 90rpx;
 	padding-bottom: 5%;
-	height: calc(100% - 100px);
+	height: calc(100% - 100rpx);
 	width: 100%;
 	background-image: linear-gradient(to bottom, #bac6fc, transparent 50%);
 	box-sizing: content-box;
@@ -89,7 +89,7 @@ img {
 	height: 65%;
 	width: 94%;
 	box-sizing: content-box;
-	border-radius: 10px;
+	border-radius: 20rpx;
 }
 
 .itembox {
@@ -116,11 +116,11 @@ img {
 	top: 35px;
 	z-index: 1000;
 	width: 100%;
-	height: 50px;
+	height: 100rpx;
 }
 
 .subtop {
-	height: 110px;
+	height: 200rpx;
 	background: #fff none;
 }
 
@@ -130,7 +130,7 @@ img {
 }
 
 .subtop .pagetit, .sectop .pagetit {
-	margin-top: -20px;
+	margin-top: -40rpx;
 }
 
 h3.contit {
@@ -670,4 +670,30 @@ span.rigadd {
 	margin: 3% 2%;
 	line-height: 3.0;
 	letter-spacing: 2px;
-}
\ No newline at end of file
+}
+
+/* 关闭按钮 */
+.closesty {
+	position: absolute;
+	top: -50rpx;
+	right: -30rpx;
+	width: 50rpx;
+	height: 50rpx;
+	background-color: #e4eafe;
+	border-radius: 50%;
+}
+.closesty:before, .closesty:after {
+	position: absolute;
+	top: 10rpx;
+	left: 25rpx;
+	content: "";
+	width: 3rpx;
+	height: 30rpx;
+	background: #000;
+	transform: rotate(45deg);
+	
+}
+.closesty:after {
+	transform: rotate(-45deg);
+}
+/* ** */
\ No newline at end of file
diff --git a/static/images/bg_qnum.png b/static/images/bg_qnum.png
new file mode 100644
index 0000000..9fad8b0
Binary files /dev/null and b/static/images/bg_qnum.png differ
diff --git a/static/images/tack.png b/static/images/tack.png
new file mode 100644
index 0000000..3f0b5e5
Binary files /dev/null and b/static/images/tack.png differ
diff --git a/subpkg/complete/complete.vue b/subpkg/complete/complete.vue
index d769e70..2482e03 100644
--- a/subpkg/complete/complete.vue
+++ b/subpkg/complete/complete.vue
@@ -52,7 +52,7 @@
 		</view>
 	</view>
 	<view class="popup-share" v-if="showShare">
-		<view @click="closeShare()" style="margin-left: 250px;">关闭</view>
+		<label class="closesty" @click="closeShare()"></label>
 		<label class="medimg"><image src="/static/images/medal_1.png"></image></label>
 		<view class="congrat">恭喜你获得1枚成就勋章！</view>
 		<view class="perinfo">
@@ -110,7 +110,7 @@
 			  this.showMedal = false
 			  this.showLayer = false
 			  clearTimeout(this.timer)
-			}, 5000)
+			}, 1000)
 			this.roleId = options.roleId
 			this.questionFreId = options.questionFreId
 			this.getQuestionList()
@@ -193,7 +193,7 @@
 		z-index: 999;
 		width: 100%;
 		height: 100%;
-		background-color: rgba(0, 0, 0, .5);
+		background-color: rgba(0, 0, 0, .35);
 	}
 	.popup-layer, .popup-share {
 		//display: none;
@@ -278,7 +278,7 @@
 	}
    .answer-content {
 	   //display: none;
-	   position: absolute;
+	   position: relative;
 	   z-index: 100; 
 	   margin: 2% 3%;
 	   padding: 2%;
@@ -323,14 +323,14 @@
    }
    
    .question-record {
-		margin: 6% 3% 10%;
+		margin: 3% 3% 10%;
 		width: 94%;
-		height: 45%;
+		height: 35%;
 		overflow: hidden;
 		label {
-		  font-size: 32rpx; 
-		  font-weight: bold;
-		  line-height: 2;  
+			font-size: 32rpx; 
+			font-weight: bold;
+			line-height: 2;  
 		}
 		.list {
 			width: 100%;
diff --git a/subpkg/rechallenge/rechallenge.vue b/subpkg/rechallenge/rechallenge.vue
index 0196a85..5e8ca7c 100644
--- a/subpkg/rechallenge/rechallenge.vue
+++ b/subpkg/rechallenge/rechallenge.vue
@@ -1,18 +1,27 @@
 <template>
-	<view>
-		<span class="title">重新挑战</span>
+	<view class="wrap">
+		<view class="stabar"></view>
+		<view class="mainwrap">
+		<view class="title">重新挑战</view>
+		
 		<view class="background-info">
-		   您上次挑战的场景是“{{sceneName}}”，挑战角色是 “{{roleName}}”，共计{{total}}道题目。您可从第1题开始重新挑战，或者任意选择其中一道题重新挑战。	
+		   您上次挑战的场景是“<font style="color:#fd6d1f;">{{sceneName}}</font>”，挑战角色是 “<font style="color:#fd6d1f;">{{roleName}}</font>”，共计{{total}}道题目。您可从第1题开始重新挑战，或者任意选择其中一道题重新挑战。	
 		</view>
+		<view class="thumbtack">
+				<label class="left"><image src="/static/images/tack.png"></image></label>
+				<label class="right"><image src="/static/images/tack.png"></image></label>
+			</view>
 		<scroll-view  class="question-info" scroll-y>
+			
 	       <view class="question-list">
 			 <view class="question-item" v-for="(item, i) in questionList" :key="i" @click="itemClickHandler(item)">
-			    <view class="question-num">{{i+1}}:{{item.ask}}</view>
+			    <view class="question-num"><view class="question-txt"><label class="imgbox"><image src="/static/images/bg_qnum.png"></image></label><label class="ordnum">{{i+1}}</label>{{item.ask}}</view></view>
 				<image :src="backgroundImg"></image>
 			 </view>
 		   </view>
 		</scroll-view>
 	</view>
+	</view>
 </template>
 
 <script>
@@ -59,27 +68,114 @@
 </script>
 
 <style>
-	.title{
-		margin-left: 40%;
-		font-size: 20px;
+	@import url("@/static/base_css.css");
+	
+	.mainwrap {
+		overflow: hidden;
+	}
+	
+	.title {
+		margin: 50rpx 0;
+		color: #333;
+		font-size: 40rpx;
+		font-weight: bold;
+		text-align: center;
 	}
-   .background-info{
-	   border: 1px solid lightgreen;
-	   width: 96%;
-	   margin-left: 2%;
+	
+   .background-info, .question-info {
+	   margin: 0 3%;
+	   padding: 2%;
+	   width: 90%;
 	   height: 200rpx;
-	   border-radius: 10px;
+	   background-color: #fff;
+	   border-radius: 20rpx;
+	   border: 1px solid rgba(151, 1, 188, .45);
+	   box-shadow: 0 0 10rpx rgba(151, 1, 188, .35);
+	   font-size: 32rpx;
+	   line-height: 1.5;
    }
    .question-info{
-   	   border: 1px solid lightgreen;
-   	   width: 96%;
-	   margin-top: 5%;
-   	   margin-left: 2%;
-   	   height: 880rpx;
-   	   border-radius: 10px;
+	   margin-top: 20rpx;
+	   padding-top: 50rpx;
+   	   height: calc(100% - 520rpx);
+	   overflow: hidden;
+   }
+   
+   .question-list {
+	   width: 100%;
+	   height: 100%;
+   }
+   
+   .question-item {
+	   position: relative;
+	   margin: 2% 0 3%;
+	   width: 100%;
+	   height: 320rpx;  
+	   border-radius: 20rpx;
+	   overflow: hidden;
+   }
+   
+   .question-item image {
+	   width: 100%;
+	   height: 100%;
+   }
+   
+   .question-num {
+		position: absolute;
+		z-index: 10;
+		width: 100%;
+		height: 100%;
+		background-color: rgba(0, 0, 0, .45);
+	}
+	
+   .question-txt {
+		position: absolute;
+		z-index: 100;
+		top: 3%;
+		left: 2%;
+		width: 96%;
+		color:#fff;	
+	}
+	
+	.question-txt .imgbox {
+		display: inline-block;
+		position: relative;
+		top: 20rpx;
+		margin: 0 12rpx;
+		width: 66rpx;
+		height: 66rpx;
+	}
+	
+	.question-txt .ordnum {
+		position: absolute;
+		left: 48rpx;
+		top: 22rpx;
+		font-size: 38rpx;
+	}
+	
+   .thumbtack {
+	   position: relative;
+	   left: 5%;
+	   width: 90%;
+   }
+   
+   .thumbtack .left, .thumbtack .right {
+	   display: inline-block;
+	   position: absolute;
+	   z-index: 100;
+	   bottom: -50rpx;
+	   left: 5%;
+	   width: 30rpx;
+	   height: 80rpx;  
+   }
+   
+   .thumbtack .right {
+	   left: auto;
+	   right: 5%;
    }
-   .question-num{
-   		    width: 96%;
-   			height: 60rpx;
+   
+   .thumbtack .left image, .thumbtack .right image, .question-txt image {
+	   width: 100%;
+	   height: 100%;
    }
 </style>
diff --git a/subpkg/review/review.vue b/subpkg/review/review.vue
index 03f27eb..9b5c986 100644
--- a/subpkg/review/review.vue
+++ b/subpkg/review/review.vue
@@ -1,9 +1,15 @@
 <template>
-	<view>
-		<span class="title">演练回顾</span>
+	<view class="wrap">
+		<view class="stabar"></view>
+		<view class="mainwrap">
+		<view class="title">演练回顾</view>
 		<view class="background-info">
-		   您已完成“{{sceneName}}”场景中 “{{roleName}}”〞角色挑战的共计{{total}}道题目，，每道题目和您选择的答案详情如下：
+		   您已完成“<font style="color:#fd6d1f;">{{sceneName}}</font>”场景中 “<font style="color:#fd6d1f;">{{roleName}}</font>”〞角色挑战的共计{{total}}道题目，，每道题目和您选择的答案详情如下：
 		</view>
+		<view class="thumbtack">
+				<label class="left"><image src="/static/images/tack.png"></image></label>
+				<label class="right"><image src="/static/images/tack.png"></image></label>
+			</view>
 		<scroll-view  class="question-info" scroll-y>
 	       <view class="question-list">
 			 <view class="question-item" v-for="(item, i) in questionList" :key="i" @click="itemClickHandler(item)">
@@ -12,6 +18,7 @@
 		   </view>
 		</scroll-view>
 	</view>
+	</view>
 </template>
 
 <script>
@@ -57,27 +64,114 @@
 </script>
 
 <style>
-	.title{
-		margin-left: 40%;
-		font-size: 20px;
+	@import url("@/static/base_css.css");
+	
+	.mainwrap {
+			overflow: hidden;
+		}
+		
+		.title {
+			margin: 50rpx 0;
+			color: #333;
+			font-size: 40rpx;
+			font-weight: bold;
+			text-align: center;
+		}
+		
+	.background-info, .question-info {
+		   margin: 0 3%;
+		   padding: 2%;
+		   width: 90%;
+		   height: 200rpx;
+		   background-color: #fff;
+		   border-radius: 20rpx;
+		   border: 1px solid rgba(151, 1, 188, .45);
+		   box-shadow: 0 0 10rpx rgba(151, 1, 188, .35);
+		   font-size: 32rpx;
+		   line-height: 1.5;
+	}
+	.question-info{
+		   margin-top: 20rpx;
+		   padding-top: 50rpx;
+		   height: calc(100% - 520rpx);
+		   overflow: hidden;
+	}
+	
+	.question-list {
+		   width: 100%;
+		   height: 100%;
+	}
+	
+	.question-item {
+		   position: relative;
+		   margin: 2% 0 3%;
+		   width: 100%;
+		   height: 320rpx;  
+		   border-radius: 20rpx;
+		   overflow: hidden;
+	}
+	
+	.question-item image {
+		   width: 100%;
+		   height: 100%;
+	}
+	
+	.question-num {
+			position: absolute;
+			z-index: 10;
+			width: 100%;
+			height: 100%;
+			background-color: rgba(0, 0, 0, .45);
+		}
+		
+	.question-txt {
+			position: absolute;
+			z-index: 100;
+			top: 3%;
+			left: 2%;
+			width: 96%;
+			color:#fff;	
+		}
+		
+		.question-txt .imgbox {
+			display: inline-block;
+			position: relative;
+			top: 20rpx;
+			margin: 0 12rpx;
+			width: 66rpx;
+			height: 66rpx;
+		}
+		
+		.question-txt .ordnum {
+			position: absolute;
+			left: 48rpx;
+			top: 22rpx;
+			font-size: 38rpx;
+		}
+		
+	.thumbtack {
+		   position: relative;
+		   left: 5%;
+		   width: 90%;
+	}
+	
+	.thumbtack .left, .thumbtack .right {
+		   display: inline-block;
+		   position: absolute;
+		   z-index: 100;
+		   bottom: -50rpx;
+		   left: 5%;
+		   width: 30rpx;
+		   height: 80rpx;  
+	}
+	
+	.thumbtack .right {
+		   left: auto;
+		   right: 5%;
+	}
+	
+	.thumbtack .left image, .thumbtack .right image, .question-txt image {
+		   width: 100%;
+		   height: 100%;
 	}
-   .background-info{
-	   border: 1px solid lightgreen;
-	   width: 96%;
-	   margin-left: 2%;
-	   height: 200rpx;
-	   border-radius: 10px;
-   }
-   .question-info{
-   	   border: 1px solid lightgreen;
-   	   width: 96%;
-	   margin-top: 5%;
-   	   margin-left: 2%;
-   	   height: 880rpx;
-   	   border-radius: 10px;
-   }
-   .question-num{
-   		    width: 96%;
-   			height: 60rpx;
-   }
 </style>