Commit 45fcde48aec7eddc80e7b8cc7f65742405dd781e
1 parent
67929349
Exists in
master
feat：答题页面搭建
Showing
21 changed files
with
547 additions
and
2 deletions
Show diff stats
2.52 KB
2.9 KB
3.28 KB
9.08 KB
276 KB
9.72 KB
10.8 KB
13.6 KB
11.5 KB
369 Bytes
381 Bytes
178 KB
201 KB
7.31 KB
228 KB
src/component/Tabbar4.vue
| @@ -10,6 +10,11 @@ | @@ -10,6 +10,11 @@ | ||
| 10 | <img v-else src="../assets/tabbar4/tab2_off.png" alt=""> | 10 | <img v-else src="../assets/tabbar4/tab2_off.png" alt=""> |
| 11 | <p>每日一习</p> | 11 | <p>每日一习</p> |
| 12 | </div> | 12 | </div> |
| 13 | + <div class="tab" :class="active=='rank'?'active':''" @click="handleRank"> | ||
| 14 | + <img v-if="active=='rank'" src="../assets/rank/rank_on.png" alt=""> | ||
| 15 | + <img v-else src="../assets/rank/rank.png" alt=""> | ||
| 16 | + <p>排行榜</p> | ||
| 17 | + </div> | ||
| 13 | <div class="tab" :class="active=='fruit'?'active':''" @click="handleFruit"> | 18 | <div class="tab" :class="active=='fruit'?'active':''" @click="handleFruit"> |
| 14 | <img v-if="active=='fruit'" src="../assets/tabbar4/fruit_on.png" alt=""> | 19 | <img v-if="active=='fruit'" src="../assets/tabbar4/fruit_on.png" alt=""> |
| 15 | <img v-else src="../assets/tabbar4/fruit_off.png" alt=""> | 20 | <img v-else src="../assets/tabbar4/fruit_off.png" alt=""> |
| @@ -43,6 +48,9 @@ export default { | @@ -43,6 +48,9 @@ export default { | ||
| 43 | handleFruit() { | 48 | handleFruit() { |
| 44 | // this.$router.replace({ path:'/achievements' }) | 49 | // this.$router.replace({ path:'/achievements' }) |
| 45 | this.$router.replace({ path:'/achievementsOne' }) | 50 | this.$router.replace({ path:'/achievementsOne' }) |
| 51 | + }, | ||
| 52 | + handleRank() { | ||
| 53 | + this.$router.replace({ path:'/rank' }) | ||
| 46 | } | 54 | } |
| 47 | } | 55 | } |
| 48 | } | 56 | } |
src/main.js
| 1 | import Vue from 'vue' | 1 | import Vue from 'vue' |
| 2 | -import { Popup, Toast, Picker, Tag, Tab, Tabs, Area, Search, Swipe, SwipeItem, Cell, List, Collapse, CollapseItem, Button, Field, Icon, Sticky, DropdownMenu, DropdownItem, Rate, Calendar, Checkbox, Empty, Lazyload, Radio, RadioGroup, CellGroup, Dialog, CheckboxGroup, NavBar, PullRefresh, Cascader , ImagePreview } from 'vant'; | 2 | +import { Popup, Toast, Picker, Tag, Tab, Tabs, Area, Search, Swipe,Col, Row , SwipeItem, Cell, List, Collapse, CollapseItem, Button, Field, Icon, Sticky, DropdownMenu, DropdownItem, Rate, Calendar, Checkbox, Empty, Lazyload, Radio, RadioGroup, CellGroup, Dialog, CheckboxGroup, NavBar, PullRefresh, Cascader , ImagePreview } from 'vant'; |
| 3 | import App from './App.vue' | 3 | import App from './App.vue' |
| 4 | import router from './router' | 4 | import router from './router' |
| 5 | import store from './store' | 5 | import store from './store' |
| @@ -54,7 +54,9 @@ Vue | @@ -54,7 +54,9 @@ Vue | ||
| 54 | .use(RadioGroup) | 54 | .use(RadioGroup) |
| 55 | .use(Cascader) | 55 | .use(Cascader) |
| 56 | .use(ImagePreview) | 56 | .use(ImagePreview) |
| 57 | - .use(Radio); | 57 | + .use(Radio) |
| 58 | + .use(Col) | ||
| 59 | + .use(Row); | ||
| 58 | Vue.config.productionTip = false; | 60 | Vue.config.productionTip = false; |
| 59 | Vue.config.ignoredElements = ['wx-open-launch-app']; | 61 | Vue.config.ignoredElements = ['wx-open-launch-app']; |
| 60 | new Vue({ | 62 | new Vue({ |
src/router/index.js
| @@ -39,6 +39,9 @@ import achievements from '@/views/Yanxue/achievements.vue' //研学成果 | @@ -39,6 +39,9 @@ import achievements from '@/views/Yanxue/achievements.vue' //研学成果 | ||
| 39 | import achievementsOne from '@/views/Yanxue/achievementsOne.vue' //研学成果 | 39 | import achievementsOne from '@/views/Yanxue/achievementsOne.vue' //研学成果 |
| 40 | import chooseSchoolOne from '@/views/Yanxue/chooseSchoolOne.vue' //研学成果 | 40 | import chooseSchoolOne from '@/views/Yanxue/chooseSchoolOne.vue' //研学成果 |
| 41 | import pageDetails from '@/views/Yanxue/pageDetails.vue' //研学成果 | 41 | import pageDetails from '@/views/Yanxue/pageDetails.vue' //研学成果 |
| 42 | +import rank from '@/views/answerRank/rank.vue' //排行榜 | ||
| 43 | +import ans_rank from '@/views/answerRank/ans_rank.vue' //答题排行榜 | ||
| 44 | +import brush_questions from '@/views/answerRank/brush_questions.vue' //刷题记录 | ||
| 42 | 45 | ||
| 43 | Vue.use(VueRouter) | 46 | Vue.use(VueRouter) |
| 44 | const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace]; | 47 | const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace]; |
| @@ -298,6 +301,30 @@ const routes = [{ | @@ -298,6 +301,30 @@ const routes = [{ | ||
| 298 | } | 301 | } |
| 299 | }, | 302 | }, |
| 300 | { | 303 | { |
| 304 | + path: '/rank', | ||
| 305 | + name: 'rank', | ||
| 306 | + component: rank, | ||
| 307 | + meta: { | ||
| 308 | + title: '排行榜' | ||
| 309 | + } | ||
| 310 | + }, | ||
| 311 | + { | ||
| 312 | + path: '/ans_rank', | ||
| 313 | + name: 'ans_rank', | ||
| 314 | + component: ans_rank, | ||
| 315 | + meta: { | ||
| 316 | + title: '排行榜' | ||
| 317 | + } | ||
| 318 | + }, | ||
| 319 | + { | ||
| 320 | + path: '/brush_questions', | ||
| 321 | + name: 'brush_questions', | ||
| 322 | + component: brush_questions, | ||
| 323 | + meta: { | ||
| 324 | + title: '刷题记录' | ||
| 325 | + } | ||
| 326 | + }, | ||
| 327 | + { | ||
| 301 | path: '/YanxueDetail', | 328 | path: '/YanxueDetail', |
| 302 | name: 'YanxueDetail', | 329 | name: 'YanxueDetail', |
| 303 | component: YanxueDetail, | 330 | component: YanxueDetail, |
| @@ -0,0 +1,227 @@ | @@ -0,0 +1,227 @@ | ||
| 1 | +<template> | ||
| 2 | + <div class="bck"> | ||
| 3 | + <div class="updete">更新时间：2022-8-22</div> | ||
| 4 | + | ||
| 5 | + <div class="context"> | ||
| 6 | + <div class="title"> | ||
| 7 | + <div | ||
| 8 | + :class="active == 'a' ? 'title_check' : 'title_nocheck'" | ||
| 9 | + @click="chooseTag('a')" | ||
| 10 | + > | ||
| 11 | + <div>个人排行榜</div> | ||
| 12 | + <div class="blue_div"></div> | ||
| 13 | + </div> | ||
| 14 | + <div | ||
| 15 | + :class="active == 'b' ? 'title_check' : 'title_nocheck'" | ||
| 16 | + @click="chooseTag('b')" | ||
| 17 | + > | ||
| 18 | + <div>学校排行榜</div> | ||
| 19 | + <div class="blue_div"></div> | ||
| 20 | + </div> | ||
| 21 | + </div> | ||
| 22 | + | ||
| 23 | + <div class="card"> | ||
| 24 | + <div class="card_item"> | ||
| 25 | + <img src="@/assets/rank/tx.png" /> | ||
| 26 | + <div>熊初墨</div> | ||
| 27 | + </div> | ||
| 28 | + <div class="card_item_red"> | ||
| 29 | + <div>暂无名次</div> | ||
| 30 | + <div>20分</div> | ||
| 31 | + </div> | ||
| 32 | + </div> | ||
| 33 | + | ||
| 34 | + <div class="table_title titleFont"> | ||
| 35 | + <div class="title_1">排名</div> | ||
| 36 | + <div class="title_2"> | ||
| 37 | + <div class="title_2_2">姓名</div> | ||
| 38 | + <div class="title_2_3">得分</div> | ||
| 39 | + </div> | ||
| 40 | + </div> | ||
| 41 | + | ||
| 42 | + <div | ||
| 43 | + class="table_title conFont" | ||
| 44 | + v-for="(v, i) in rankList" | ||
| 45 | + :key="i" | ||
| 46 | + > | ||
| 47 | + <div class="title_1" v-if="i == 0"> | ||
| 48 | + <img src="@/assets/rank/1.png" /> | ||
| 49 | + </div> | ||
| 50 | + <div class="title_1" v-if="i == 1"> | ||
| 51 | + <img src="@/assets/rank/2.png" /> | ||
| 52 | + </div> | ||
| 53 | + <div class="title_1" v-if="i == 2"> | ||
| 54 | + <img src="@/assets/rank/3.png" /> | ||
| 55 | + </div> | ||
| 56 | + <div class="title_1" v-if="i > 2">{{ i + 1 }}</div> | ||
| 57 | + <div class="title_2"> | ||
| 58 | + <div class="title_2_2">柯桥中学</div> | ||
| 59 | + <div class="title_2_3">120</div> | ||
| 60 | + </div> | ||
| 61 | + </div> | ||
| 62 | + </div> | ||
| 63 | + </div> | ||
| 64 | +</template> | ||
| 65 | + | ||
| 66 | +<script> | ||
| 67 | +import Tabbar4 from "@/component/Tabbar4"; | ||
| 68 | +export default { | ||
| 69 | + components: { Tabbar4 }, | ||
| 70 | + data() { | ||
| 71 | + return { | ||
| 72 | + active: "a", | ||
| 73 | + rankList: [{}, {}, {}, {}], | ||
| 74 | + }; | ||
| 75 | + }, | ||
| 76 | + methods: { | ||
| 77 | + chooseTag(val) { | ||
| 78 | + this.active = val; | ||
| 79 | + }, | ||
| 80 | + }, | ||
| 81 | +}; | ||
| 82 | +</script> | ||
| 83 | + | ||
| 84 | +<style lang="scss" scoped> | ||
| 85 | +.bck { | ||
| 86 | + position: absolute; | ||
| 87 | + width: 100vw; | ||
| 88 | + min-height: 100vh; | ||
| 89 | + background-image: url("../../assets/rank/red_rank.png"); | ||
| 90 | + -moz-background-size: 100% 100%; | ||
| 91 | + background-size: 100% 100%; | ||
| 92 | + | ||
| 93 | + .updete { | ||
| 94 | + position: absolute; | ||
| 95 | + top: 15vh; | ||
| 96 | + left: 6vw; | ||
| 97 | + font-size: 4.2vw; | ||
| 98 | + color: #fff; | ||
| 99 | + opacity: 0.8; | ||
| 100 | + } | ||
| 101 | + | ||
| 102 | + .context { | ||
| 103 | + width: 94vw; | ||
| 104 | + min-height: 1100px; | ||
| 105 | + background-color: #fff; | ||
| 106 | + margin-top: 310px; | ||
| 107 | + margin-left: 3vw; | ||
| 108 | + margin-bottom: 50px; | ||
| 109 | + border-radius: 80px; | ||
| 110 | + padding: 2vw 5vw; | ||
| 111 | + box-sizing: border-box; | ||
| 112 | + | ||
| 113 | + .title { | ||
| 114 | + width: 90%; | ||
| 115 | + height: 100px; | ||
| 116 | + margin-top: 40px; | ||
| 117 | + display: flex; | ||
| 118 | + align-items: center; | ||
| 119 | + | ||
| 120 | + .title_check { | ||
| 121 | + font-size: 5vw; | ||
| 122 | + color: #333333; | ||
| 123 | + margin: 0 3vw; | ||
| 124 | + font-weight: 800; | ||
| 125 | + | ||
| 126 | + .blue_div { | ||
| 127 | + width: 50px; | ||
| 128 | + height: 15px; | ||
| 129 | + border-radius: 10px; | ||
| 130 | + margin-left: 10vw; | ||
| 131 | + margin-top: 20px; | ||
| 132 | + background-color: #0b91f3; | ||
| 133 | + } | ||
| 134 | + } | ||
| 135 | + .title_nocheck { | ||
| 136 | + font-size: 4.2vw; | ||
| 137 | + color: #999999; | ||
| 138 | + margin: 0 3vw; | ||
| 139 | + | ||
| 140 | + .blue_div { | ||
| 141 | + width: 50px; | ||
| 142 | + height: 15px; | ||
| 143 | + border-radius: 10px; | ||
| 144 | + margin-left: 10vw; | ||
| 145 | + margin-top: 20px; | ||
| 146 | + background-color: #fff; | ||
| 147 | + } | ||
| 148 | + } | ||
| 149 | + } | ||
| 150 | + | ||
| 151 | + .card { | ||
| 152 | + width: 100%; | ||
| 153 | + height: 170px; | ||
| 154 | + margin-top: 20px; | ||
| 155 | + box-shadow: 1px 1px 4px rgb(197, 197, 197); | ||
| 156 | + padding: 3vw; | ||
| 157 | + box-sizing: border-box; | ||
| 158 | + display: flex; | ||
| 159 | + justify-content: space-between; | ||
| 160 | + | ||
| 161 | + .card_item { | ||
| 162 | + width: 50%; | ||
| 163 | + font-size: 4.6vw; | ||
| 164 | + font-weight: 700; | ||
| 165 | + color: #333333; | ||
| 166 | + display: flex; | ||
| 167 | + align-items: center; | ||
| 168 | + padding-left: 10px; | ||
| 169 | + box-sizing: border-box; | ||
| 170 | + | ||
| 171 | + img { | ||
| 172 | + width: 90px; | ||
| 173 | + height: 90px; | ||
| 174 | + margin-right: 17px; | ||
| 175 | + } | ||
| 176 | + } | ||
| 177 | + .card_item_red { | ||
| 178 | + width: 50%; | ||
| 179 | + font-size: 4vw; | ||
| 180 | + color: #fd4649; | ||
| 181 | + display: flex; | ||
| 182 | + align-items: center; | ||
| 183 | + justify-content: space-around; | ||
| 184 | + } | ||
| 185 | + } | ||
| 186 | + | ||
| 187 | + .table_title { | ||
| 188 | + width: 100%; | ||
| 189 | + height: 100px; | ||
| 190 | + margin-top: 25px; | ||
| 191 | + padding: 20px 3vw 3vw 0; | ||
| 192 | + box-sizing: border-box; | ||
| 193 | + display: flex; | ||
| 194 | + justify-content: space-between; | ||
| 195 | + align-items: center; | ||
| 196 | + | ||
| 197 | + .title_1 { | ||
| 198 | + width: 15%; | ||
| 199 | + text-align: center; | ||
| 200 | + | ||
| 201 | + img { | ||
| 202 | + width: 55px; | ||
| 203 | + height: 70px; | ||
| 204 | + } | ||
| 205 | + } | ||
| 206 | + .title_2 { | ||
| 207 | + width: 70%; | ||
| 208 | + display: flex; | ||
| 209 | + justify-content: space-between; | ||
| 210 | + | ||
| 211 | + .title_2_3 { | ||
| 212 | + width: 10vw; | ||
| 213 | + text-align: left; | ||
| 214 | + } | ||
| 215 | + } | ||
| 216 | + } | ||
| 217 | + .titleFont { | ||
| 218 | + font-size: 4.5vw; | ||
| 219 | + color: #999999; | ||
| 220 | + } | ||
| 221 | + .conFont { | ||
| 222 | + font-size: 4.45vw; | ||
| 223 | + color: #333333; | ||
| 224 | + } | ||
| 225 | + } | ||
| 226 | +} | ||
| 227 | +</style> | ||
| 0 | \ No newline at end of file | 228 | \ No newline at end of file |
| @@ -0,0 +1,111 @@ | @@ -0,0 +1,111 @@ | ||
| 1 | +<template> | ||
| 2 | + <div> | ||
| 3 | + <div class="card"> | ||
| 4 | + <div class="card_title"> | ||
| 5 | + <div>星期一</div> | ||
| 6 | + <span>2021年3月12</span> | ||
| 7 | + </div> | ||
| 8 | + | ||
| 9 | + <div class="card_con"> | ||
| 10 | + <div class="card_L"></div> | ||
| 11 | + <div class="card_R"> | ||
| 12 | + <div class="card_R_text"> | ||
| 13 | + <div class="text_title">革命遗址-青铜级</div> | ||
| 14 | + <div class="text_grey">用时：20:21</div> | ||
| 15 | + <div class="text_grey">错误：3题</div> | ||
| 16 | + </div> | ||
| 17 | + <div class="card_R_btn"> | ||
| 18 | + <div class="btn">查看</div> | ||
| 19 | + </div> | ||
| 20 | + </div> | ||
| 21 | + </div> | ||
| 22 | + </div> | ||
| 23 | + </div> | ||
| 24 | +</template> | ||
| 25 | + | ||
| 26 | +<script> | ||
| 27 | +export default { | ||
| 28 | + data() { | ||
| 29 | + return {}; | ||
| 30 | + }, | ||
| 31 | +}; | ||
| 32 | +</script> | ||
| 33 | + | ||
| 34 | +<style lang="scss" scoped> | ||
| 35 | +.card { | ||
| 36 | + padding: 3vw 5vw; | ||
| 37 | + box-sizing: border-box; | ||
| 38 | + | ||
| 39 | + .card_title { | ||
| 40 | + display: flex; | ||
| 41 | + align-items: center; | ||
| 42 | + color: #333333; | ||
| 43 | + font-size: 35px; | ||
| 44 | + font-weight: 700; | ||
| 45 | + margin: 20px 0; | ||
| 46 | + | ||
| 47 | + span { | ||
| 48 | + color: #999999; | ||
| 49 | + font-size: 30px; | ||
| 50 | + margin-left: 30px; | ||
| 51 | + } | ||
| 52 | + } | ||
| 53 | + | ||
| 54 | + .card_con { | ||
| 55 | + display: flex; | ||
| 56 | + | ||
| 57 | + .card_L { | ||
| 58 | + width: 5px; | ||
| 59 | + margin-left: 5vw; | ||
| 60 | + background-color: #f5f6fa; | ||
| 61 | + } | ||
| 62 | + .card_R { | ||
| 63 | + width: 80%; | ||
| 64 | + height: 210px; | ||
| 65 | + margin: 50px 0 50px 10vw; | ||
| 66 | + background-color: #f6f9fd; | ||
| 67 | + padding: 30px; | ||
| 68 | + box-sizing: border-box; | ||
| 69 | + display: flex; | ||
| 70 | + justify-content: space-between; | ||
| 71 | + | ||
| 72 | + .card_R_text { | ||
| 73 | + width: 80%; | ||
| 74 | + display: flex; | ||
| 75 | + align-content: space-between; | ||
| 76 | + flex-wrap: wrap; | ||
| 77 | + margin-left: 10px; | ||
| 78 | + | ||
| 79 | + .text_title { | ||
| 80 | + width: 100%; | ||
| 81 | + font-size: 30px; | ||
| 82 | + color: #333333; | ||
| 83 | + } | ||
| 84 | + .text_grey { | ||
| 85 | + width: 100%; | ||
| 86 | + font-size: 28px; | ||
| 87 | + color: #999999; | ||
| 88 | + } | ||
| 89 | + } | ||
| 90 | + .card_R_btn { | ||
| 91 | + width: 20%; | ||
| 92 | + display: flex; | ||
| 93 | + align-items: center; | ||
| 94 | + | ||
| 95 | + .btn { | ||
| 96 | + width: 120px; | ||
| 97 | + height: 60px; | ||
| 98 | + background-color: #6673ff; | ||
| 99 | + color: #fff; | ||
| 100 | + font-size: 28px; | ||
| 101 | + border-radius: 28px; | ||
| 102 | + display: flex; | ||
| 103 | + align-items: center; | ||
| 104 | + justify-content: center; | ||
| 105 | + letter-spacing: 2px; | ||
| 106 | + } | ||
| 107 | + } | ||
| 108 | + } | ||
| 109 | + } | ||
| 110 | +} | ||
| 111 | +</style> | ||
| 0 | \ No newline at end of file | 112 | \ No newline at end of file |
| @@ -0,0 +1,170 @@ | @@ -0,0 +1,170 @@ | ||
| 1 | +<template> | ||
| 2 | + <div class="bck"> | ||
| 3 | + <div class="context"> | ||
| 4 | + <div class="title"> | ||
| 5 | + <div | ||
| 6 | + :class="active == 'a' ? 'title_check' : 'title_nocheck'" | ||
| 7 | + @click="chooseTag('a')" | ||
| 8 | + > | ||
| 9 | + <div>研学成果量</div> | ||
| 10 | + <div class="blue_div"></div> | ||
| 11 | + </div> | ||
| 12 | + <div | ||
| 13 | + :class="active == 'b' ? 'title_check' : 'title_nocheck'" | ||
| 14 | + @click="chooseTag('b')" | ||
| 15 | + > | ||
| 16 | + <div>成果浏览量</div> | ||
| 17 | + <div class="blue_div"></div> | ||
| 18 | + </div> | ||
| 19 | + </div> | ||
| 20 | + | ||
| 21 | + <div class="table_title titleFont"> | ||
| 22 | + <div class="title_1">排名</div> | ||
| 23 | + <div class="title_2"> | ||
| 24 | + <div class="title_2_2">学校名称</div> | ||
| 25 | + <div class="title_2_3">数量</div> | ||
| 26 | + </div> | ||
| 27 | + </div> | ||
| 28 | + | ||
| 29 | + <div class="table_title conFont" v-for="(v,i) in rankList" :key="i"> | ||
| 30 | + <div class="title_1" v-if="i == 0"> | ||
| 31 | + <img src="@/assets/rank/1.png" /> | ||
| 32 | + </div> | ||
| 33 | + <div class="title_1" v-if="i == 1"> | ||
| 34 | + <img src="@/assets/rank/2.png" /> | ||
| 35 | + </div> | ||
| 36 | + <div class="title_1" v-if="i == 2"> | ||
| 37 | + <img src="@/assets/rank/3.png" /> | ||
| 38 | + </div> | ||
| 39 | + <div class="title_1" v-if="i > 2">{{i +1}}</div> | ||
| 40 | + <div class="title_2"> | ||
| 41 | + <div class="title_2_2">柯桥中学</div> | ||
| 42 | + <div class="title_2_3">120</div> | ||
| 43 | + </div> | ||
| 44 | + </div> | ||
| 45 | + </div> | ||
| 46 | + | ||
| 47 | + <tabbar4 active="rank"></tabbar4> | ||
| 48 | + </div> | ||
| 49 | +</template> | ||
| 50 | + | ||
| 51 | +<script> | ||
| 52 | +import Tabbar4 from "@/component/Tabbar4"; | ||
| 53 | +export default { | ||
| 54 | + components: { Tabbar4 }, | ||
| 55 | + data() { | ||
| 56 | + return { | ||
| 57 | + active: "a", | ||
| 58 | + rankList: [ | ||
| 59 | + {}, | ||
| 60 | + {}, | ||
| 61 | + {}, | ||
| 62 | + {}, | ||
| 63 | + ] | ||
| 64 | + }; | ||
| 65 | + }, | ||
| 66 | + methods: { | ||
| 67 | + chooseTag(val) { | ||
| 68 | + this.active = val; | ||
| 69 | + }, | ||
| 70 | + }, | ||
| 71 | +}; | ||
| 72 | +</script> | ||
| 73 | + | ||
| 74 | +<style lang="scss" scoped> | ||
| 75 | +.bck { | ||
| 76 | + position: absolute; | ||
| 77 | + width: 100vw; | ||
| 78 | + height: 100vh; | ||
| 79 | + background-image: url("../../assets/rank/blue_rank.png"); | ||
| 80 | + -moz-background-size: 100% 100%; | ||
| 81 | + background-size: 100% 100%; | ||
| 82 | + | ||
| 83 | + .context { | ||
| 84 | + width: 100vw; | ||
| 85 | + min-height: 1100px; | ||
| 86 | + background-color: #fff; | ||
| 87 | + margin-top: 310px; | ||
| 88 | + border-radius: 80px; | ||
| 89 | + padding: 2vw 5vw; | ||
| 90 | + box-sizing: border-box; | ||
| 91 | + | ||
| 92 | + .title { | ||
| 93 | + width: 90%; | ||
| 94 | + height: 100px; | ||
| 95 | + margin-top: 40px; | ||
| 96 | + display: flex; | ||
| 97 | + align-items: center; | ||
| 98 | + | ||
| 99 | + .title_check { | ||
| 100 | + font-size: 5vw; | ||
| 101 | + color: #333333; | ||
| 102 | + margin: 0 3vw; | ||
| 103 | + font-weight: 800; | ||
| 104 | + | ||
| 105 | + .blue_div { | ||
| 106 | + width: 50px; | ||
| 107 | + height: 15px; | ||
| 108 | + border-radius: 10px; | ||
| 109 | + margin-left: 10vw; | ||
| 110 | + margin-top: 20px; | ||
| 111 | + background-color: #0b91f3; | ||
| 112 | + } | ||
| 113 | + } | ||
| 114 | + .title_nocheck { | ||
| 115 | + font-size: 4.2vw; | ||
| 116 | + color: #999999; | ||
| 117 | + margin: 0 3vw; | ||
| 118 | + | ||
| 119 | + .blue_div { | ||
| 120 | + width: 50px; | ||
| 121 | + height: 15px; | ||
| 122 | + border-radius: 10px; | ||
| 123 | + margin-left: 10vw; | ||
| 124 | + margin-top: 20px; | ||
| 125 | + background-color: #fff; | ||
| 126 | + } | ||
| 127 | + } | ||
| 128 | + } | ||
| 129 | + | ||
| 130 | + .table_title { | ||
| 131 | + width: 100%; | ||
| 132 | + height: 110px; | ||
| 133 | + margin-top: 25px; | ||
| 134 | + padding: 20px 3vw 3vw 0; | ||
| 135 | + box-sizing: border-box; | ||
| 136 | + display: flex; | ||
| 137 | + justify-content: space-between; | ||
| 138 | + align-items: center; | ||
| 139 | + | ||
| 140 | + .title_1 { | ||
| 141 | + width: 15%; | ||
| 142 | + text-align: center; | ||
| 143 | + | ||
| 144 | + img { | ||
| 145 | + width: 55px; | ||
| 146 | + height: 70px; | ||
| 147 | + } | ||
| 148 | + } | ||
| 149 | + .title_2 { | ||
| 150 | + width: 70%; | ||
| 151 | + display: flex; | ||
| 152 | + justify-content: space-between; | ||
| 153 | + | ||
| 154 | + .title_2_3{ | ||
| 155 | + width: 10vw; | ||
| 156 | + text-align: left; | ||
| 157 | + } | ||
| 158 | + } | ||
| 159 | + } | ||
| 160 | + .titleFont { | ||
| 161 | + font-size: 4.5vw; | ||
| 162 | + color: #999999; | ||
| 163 | + } | ||
| 164 | + .conFont { | ||
| 165 | + font-size: 4.45vw; | ||
| 166 | + color: #333333; | ||
| 167 | + } | ||
| 168 | + } | ||
| 169 | +} | ||
| 170 | +</style> | ||
| 0 | \ No newline at end of file | 171 | \ No newline at end of file |