新增举报条目以及多语言土耳其

替换sid规则
修复搜索公会等级图片异常问题
2024-12-18 20:37:14 +08:00 · 2024-12-13 19:08:06 +08:00 · 2024-12-11 14:54:56 +08:00 · 2024-12-11 10:49:41 +08:00 · 2024-12-10 18:44:44 +08:00 · 2024-12-10 18:44:44 +08:00
211 changed files with 9526 additions and 1934 deletions
--- a/view/molistar/activity/customizedGift/css/index.css
+++ b/view/molistar/activity/customizedGift/css/index.css
--- a/view/molistar/activity/customizedGift/css/index.scss
+++ b/view/molistar/activity/customizedGift/css/index.scss
--- a/view/molistar/activity/customizedGift/images/1-ar.png
+++ b/view/molistar/activity/customizedGift/images/1-ar.png
--- a/view/molistar/activity/customizedGift/images/1.png
+++ b/view/molistar/activity/customizedGift/images/1.png
--- a/view/molistar/activity/customizedGift/images/2-ar.png
+++ b/view/molistar/activity/customizedGift/images/2-ar.png
--- a/view/molistar/activity/customizedGift/images/2.png
+++ b/view/molistar/activity/customizedGift/images/2.png
--- a/view/molistar/activity/customizedGift/images/3-ar.png
+++ b/view/molistar/activity/customizedGift/images/3-ar.png
--- a/view/molistar/activity/customizedGift/images/3.png
+++ b/view/molistar/activity/customizedGift/images/3.png
--- a/view/molistar/activity/customizedGift/images/4-ar.png
+++ b/view/molistar/activity/customizedGift/images/4-ar.png
--- a/view/molistar/activity/customizedGift/images/4.png
+++ b/view/molistar/activity/customizedGift/images/4.png
--- a/view/molistar/activity/customizedGift/images/5-ar.png
+++ b/view/molistar/activity/customizedGift/images/5-ar.png
--- a/view/molistar/activity/customizedGift/images/5.png
+++ b/view/molistar/activity/customizedGift/images/5.png
--- a/view/molistar/activity/customizedGift/images/6-ar.png
+++ b/view/molistar/activity/customizedGift/images/6-ar.png
--- a/view/molistar/activity/customizedGift/images/6.png
+++ b/view/molistar/activity/customizedGift/images/6.png
--- a/view/molistar/activity/customizedGift/images/bgBottom.png
+++ b/view/molistar/activity/customizedGift/images/bgBottom.png
--- a/view/molistar/activity/customizedGift/images/bgCentent.png
+++ b/view/molistar/activity/customizedGift/images/bgCentent.png
--- a/view/molistar/activity/customizedGift/images/bgTop.png
+++ b/view/molistar/activity/customizedGift/images/bgTop.png
--- a/view/molistar/activity/customizedGift/images/bgTopL.png
+++ b/view/molistar/activity/customizedGift/images/bgTopL.png
--- a/view/molistar/activity/customizedGift/images/bgTopS.png
+++ b/view/molistar/activity/customizedGift/images/bgTopS.png
--- a/view/molistar/activity/customizedGift/images/close.png
+++ b/view/molistar/activity/customizedGift/images/close.png
--- a/view/molistar/activity/customizedGift/images/gift.gif
+++ b/view/molistar/activity/customizedGift/images/gift.gif
--- a/view/molistar/activity/customizedGift/images/header-ar.png
+++ b/view/molistar/activity/customizedGift/images/header-ar.png
--- a/view/molistar/activity/customizedGift/images/header.png
+++ b/view/molistar/activity/customizedGift/images/header.png
--- a/view/molistar/activity/customizedGift/images/liBg.png
+++ b/view/molistar/activity/customizedGift/images/liBg.png
--- a/view/molistar/activity/customizedGift/images/liBgB.png
+++ b/view/molistar/activity/customizedGift/images/liBgB.png
--- a/view/molistar/activity/customizedGift/images/null.png
+++ b/view/molistar/activity/customizedGift/images/null.png
--- a/view/molistar/activity/customizedGift/images/numBg.png
+++ b/view/molistar/activity/customizedGift/images/numBg.png
--- a/view/molistar/activity/customizedGift/images/reward.png
+++ b/view/molistar/activity/customizedGift/images/reward.png
--- a/view/molistar/activity/customizedGift/images/reward1-ar.png
+++ b/view/molistar/activity/customizedGift/images/reward1-ar.png
--- a/view/molistar/activity/customizedGift/images/reward1.png
+++ b/view/molistar/activity/customizedGift/images/reward1.png
--- a/view/molistar/activity/customizedGift/images/reward2.png
+++ b/view/molistar/activity/customizedGift/images/reward2.png
--- a/view/molistar/activity/customizedGift/images/reward3.png
+++ b/view/molistar/activity/customizedGift/images/reward3.png
--- a/view/molistar/activity/customizedGift/images/rewardBox.png
+++ b/view/molistar/activity/customizedGift/images/rewardBox.png
--- a/view/molistar/activity/customizedGift/images/rule.png
+++ b/view/molistar/activity/customizedGift/images/rule.png
--- a/view/molistar/activity/customizedGift/images/rule_bg.png
+++ b/view/molistar/activity/customizedGift/images/rule_bg.png
--- a/view/molistar/activity/customizedGift/images/tab.png
+++ b/view/molistar/activity/customizedGift/images/tab.png
--- a/view/molistar/activity/customizedGift/images/tabAct.png
+++ b/view/molistar/activity/customizedGift/images/tabAct.png
--- a/view/molistar/activity/customizedGift/images/title.png
+++ b/view/molistar/activity/customizedGift/images/title.png
--- a/view/molistar/activity/customizedGift/images/titleBox.png
+++ b/view/molistar/activity/customizedGift/images/titleBox.png
--- a/view/molistar/activity/customizedGift/images/top1.png
+++ b/view/molistar/activity/customizedGift/images/top1.png
--- a/view/molistar/activity/customizedGift/images/top2.png
+++ b/view/molistar/activity/customizedGift/images/top2.png
--- a/view/molistar/activity/customizedGift/images/top3.png
+++ b/view/molistar/activity/customizedGift/images/top3.png
--- a/view/molistar/activity/customizedGift/images/travel/back.png
+++ b/view/molistar/activity/customizedGift/images/travel/back.png
--- a/view/molistar/activity/customizedGift/images/travel/backB.png
+++ b/view/molistar/activity/customizedGift/images/travel/backB.png
--- a/view/molistar/activity/customizedGift/images/ts1.png
+++ b/view/molistar/activity/customizedGift/images/ts1.png
--- a/view/molistar/activity/customizedGift/images/ts2.png
+++ b/view/molistar/activity/customizedGift/images/ts2.png
--- a/view/molistar/activity/customizedGift/images/ts3.png
+++ b/view/molistar/activity/customizedGift/images/ts3.png
--- a/view/molistar/activity/customizedGift/images/why.png
+++ b/view/molistar/activity/customizedGift/images/why.png
--- a/view/molistar/activity/customizedGift/index.html
+++ b/view/molistar/activity/customizedGift/index.html
@@ -0,0 +1,257 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div>
+    <!-- header -->
+    <div class="header"></div>
+    <!-- 标题盒子 -->
+    <div class="activityIntroduction">
+        <div class="title text2"></div>
+        <div class="box text3">
+            
+        </div>
+    </div>
+    <!-- 上周前三榜单 -->
+    <div class="lastWeek">
+        <div class="top">
+            <div class="title text4"></div>
+            <div class="top1">
+                <img src="./images/null.png" alt="" class="tx">
+                <div class="name"><b class="text5"></b><strong></strong></div>
+                <div class="giftedTime"><b class="text6"></b><strong></strong></div>
+            </div>
+            <div class="top2">
+                <img src="./images/null.png" alt="" class="tx">
+                <div class="name"><b class="text5">Gift name:</b><strong></strong></div>
+                <div class="giftedTime"><b class="text6">Gifted time:</b><strong></strong></div>
+            </div>
+            <div class="top3">
+                <img src="./images/null.png" alt="" class="tx">
+                <div class="name"><b class="text5">Gift name:</b><strong></strong></div>
+                <div class="giftedTime"><b class="text6">Gifted time:</b><strong></strong></div>
+            </div>
+        </div>
+        <div class="content">
+        </div>
+        <div class="bottom"></div>
+    </div>
+    <!-- tab切换 -->
+    <div class="tabBox">
+        <div class="text7"></div>
+        <div class="act text8"></div>
+    </div>
+    <!-- 本周榜单 -->
+    <div class="page1">
+        <div class="thisWeek">
+            <div class="top">
+                <!-- 规则 -->
+                <div class="rule text9"></div>
+                <!-- 奖励 -->
+                <div class="reward">
+                    <span class="text10"></span>
+                </div>
+                <!-- 倒计时 -->
+                <div class="countdownText text11"></div>
+                <div class="countdown">
+                    <div class="day">
+                        <span>0</span>
+                        <b class="text12"></b>
+                    </div>
+                    <div class="hours">
+                        <span>0</span>
+                        <b class="text13"></b>
+                    </div>
+                    <div class="mins">
+                        <span>0</span>
+                        <b class="text14"></b>
+                    </div>
+                    <div class="secs">
+                        <span>0</span>
+                        <b class="text15"></b>
+                    </div>
+                </div>
+                <div class="top1">
+                    <img src="./images/null.png" alt="" class="tx">
+                    <div class="name"><b class="text5">Gift name:</b><strong></strong></div>
+                    <div class="giftedTime"><b class="text6">Gifted time:</b><strong></strong></div>
+                </div>
+                <div class="top2">
+                    <img src="./images/null.png" alt="" class="tx">
+                    <div class="name"><b class="text5">Gift name:</b><strong></strong></div>
+                    <div class="giftedTime"><b class="text6">Gifted time:</b><strong></strong></div>
+                </div>
+                <div class="top3">
+                    <img src="./images/null.png" alt="" class="tx">
+                    <div class="name"><b class="text5">Gift name:</b><strong></strong></div>
+                    <div class="giftedTime"><b class="text6">Gifted time:</b><strong></strong></div>
+                </div>
+            </div>
+            <div class="content">
+                <ul>
+                    <li>
+                        <div class="num">0</div>
+                        <img src="./images/null.png" alt="" class="tx">
+                        <div class="giftInfo">
+                            <p>Gift name:GAÚCHA</p>
+                            <b>Gifted time:500</b>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+            <div class="bottom"></div>
+        </div>
+    </div>
+    <!-- 自己榜单 -->
+    <div class="page2">
+        <div class="myList">
+            <div class="top">
+                <!-- 规则 -->
+                <div class="rule text9">Rule</div>
+                <!-- 奖励 -->
+                <div class="reward">
+                    <span class="text10">Reward</span>
+                </div>
+                <!-- 倒计时 -->
+                <div class="countdownText text16"></div>
+                <div class="countdown">
+                    <div class="day">
+                        <span>0</span>
+                        <b class="text12">Day</b>
+                    </div>
+                    <div class="hours">
+                        <span>0</span>
+                        <b class="text13">Hours</b>
+                    </div>
+                    <div class="mins">
+                        <span>0</span>
+                        <b class="text14">Mins</b>
+                    </div>
+                    <div class="secs">
+                        <span>0</span>
+                        <b class="text15">Secs</b>
+                    </div>
+                </div>
+                <div class="my">
+                    <img src="./images/null.png" alt="" class="tx">
+                    <div>
+                        <p>Momo</p>
+                        <b>Gifted time:0</b>
+                        <span>Coins of Gifted:0</span>
+                    </div>
+                </div>
+            </div>
+            <div class="content">
+                <ul>
+                    <li>
+                        <div class="num">0</div>
+                        <img src="./images/ts1.png" alt="" class="ts">
+                        <img src="./images/null.png" alt="" class="tx">
+                        <span>名称</span>
+                        <div class="giftInfo">
+                            <p>Gifted time:500</p>
+                            <b>Coins of Gifted:900</b>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+            <div class="bottom"></div>
+        </div>
+    </div>
+    <!-- 规则 -->
+    <div class="ruleBox">
+        <div class="rule_in">
+            <div class="title text9">Rule</div>
+            <img src="./images/close.png" alt="" class="close">
+            <div class="box text17">
+                
+            </div>
+        </div>
+    </div>
+    <!-- 规则 -->
+    <div class="ruleBox2">
+        <div class="rule_in">
+            <div class="title text9">Rule</div>
+            <img src="./images/close.png" alt="" class="close">
+            <div class="box text18">
+                
+            </div>
+        </div>
+    </div>
+    <!-- 奖励 -->
+    <div class="rewardBox">
+        <div class="rule_in">
+            <div class="title text10">Reward</div>
+            <img src="./images/close.png" alt="" class="close">
+            <div class="box">
+                <p class="text19"></p>
+                <img src="./images/reward1.png" alt="" class="img1">
+                <p class="text20"></p>
+                <img src="./images/reward2.png" alt="" class="img2">
+                <p class="text21" style="margin-bottom: .3rem;"></p>
+                <p class="text22"></p>
+                <img src="./images/reward3.png" alt="" class="img3">
+            </div>
+        </div>
+    </div>
+    <!-- 奖励2 -->
+    <div class="rewardBox2">
+        <div class="rule_in">
+            <div class="title text10">Reward</div>
+            <img src="./images/close.png" alt="" class="close">
+            <div class="stabBox">
+                <div>700</div>
+                <div>2100</div>
+                <div>3500</div>
+                <div>4900</div>
+                <div>5600</div>
+                <div class="act">7000</div>
+            </div>
+            <div class="box">
+                <p class="text23" style="text-align: center;"></p>
+                <img src="./images/1.png" alt="" class="img1">
+                <img src="./images/2.png" alt="" class="img2">
+                <img src="./images/3.png" alt="" class="img3">
+                <div style="display: none;" class="img4 boxs">
+                    <div class="why">
+                        <span class="text24"></span>
+                    </div>
+                </div>
+                <div style="display: none;" class="img5 boxs">
+                    <div class="why">
+                        <span class="text244"></span>
+                    </div>
+                </div>
+                <div class="img6 boxs">
+                    <div class="why">
+                        <span class="text2444"></span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./js/index.js?v=1.0"></script>
+<script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/activity/customizedGift/js/index.js
+++ b/view/molistar/activity/customizedGift/js/index.js
@@ -0,0 +1,348 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+var langReplace;
+var localLang;
+const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success(e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+var countupTime1;//倒计时容器
+var countupTime2;//倒计时容器
+// 初始化函數
+$(function () {
+    getInfoFromClient();
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+    setTimeout(function () {
+        // 頁面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 頂部返回事件
+        $('.back img').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        rankGift();
+        giftRank();
+    }, 100)
+})
+function translateFun() {
+    var langReplace = window.lang.replace;
+    var localLang = window.lang;
+    $('.text1').html(langReplace(localLang.demoModule.text1));
+    $('.text2').html(langReplace(localLang.demoModule.text2));
+    $('.text3').html(langReplace(localLang.demoModule.text3));
+    $('.text4').html(langReplace(localLang.demoModule.text4));
+    $('.text5').html(langReplace(localLang.demoModule.text5));
+    $('.text6').html(langReplace(localLang.demoModule.text6));
+    $('.text7').html(langReplace(localLang.demoModule.text7));
+    $('.text8').html(langReplace(localLang.demoModule.text8));
+    $('.text9').html(langReplace(localLang.demoModule.text9));
+    $('.text10').html(langReplace(localLang.demoModule.text10));
+    $('.text11').html(langReplace(localLang.demoModule.text11));
+    $('.text12').html(langReplace(localLang.demoModule.text12));
+    $('.text13').html(langReplace(localLang.demoModule.text13));
+    $('.text14').html(langReplace(localLang.demoModule.text14));
+    $('.text15').html(langReplace(localLang.demoModule.text15));
+    $('.text16').html(langReplace(localLang.demoModule.text16));
+    $('.text17').html(langReplace(localLang.demoModule.text17));
+    $('.text18').html(langReplace(localLang.demoModule.text18));
+    $('.text19').html(langReplace(localLang.demoModule.text19));
+    $('.text20').html(langReplace(localLang.demoModule.text20));
+    $('.text21').html(langReplace(localLang.demoModule.text21));
+    $('.text22').html(langReplace(localLang.demoModule.text22));
+    $('.text23').html(langReplace(localLang.demoModule.text23));
+    $('.text24').html(langReplace(localLang.demoModule.text24));
+    $('.text244').html(langReplace(localLang.demoModule.text244));
+    $('.text2444').html(langReplace(localLang.demoModule.text2444));
+    $('.text25').html(langReplace(localLang.demoModule.text25));
+    $('.rewardBox .rule_in .box .img1').attr('src', langReplace(localLang.demoModule.img1));
+    $('.rewardBox2 .rule_in .box .img1').attr('src', langReplace(localLang.demoModule.img2));
+    $('.rewardBox2 .rule_in .box .img2').attr('src', langReplace(localLang.demoModule.img3));
+    $('.rewardBox2 .rule_in .box .img3').attr('src', langReplace(localLang.demoModule.img4));
+}
+// 第一Tab接口
+function rankGift() {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/activity/h5/special/gift/rank/gift',
+        data: { uid: pubInfo.uid },
+        success(res) {
+            if (res.code === 200) {
+                // 处理倒计时
+                countup1(res.data.endTime - res.timestamp);
+                var listTo3 = res.data.lastWeekTop.slice(0, 3);
+                if (listTo3.length < 3) {
+                    let arr = new Array(3 - listTo3.length).fill({
+                        picUrl: './images/null.png',
+                        giftName: 'Vacant',
+                        giftNum: "Vacant"
+                    })
+                    listTo3.push(...arr)
+                }
+                // 处理上周数据
+                listTo3.forEach((res, i) => {
+                    $(`.lastWeek .top .top${i + 1} .tx`).attr('src', res.picUrl);
+                    $(`.lastWeek .top .top${i + 1} .name strong`).text(res.giftName);
+                    $(`.lastWeek .top .top${i + 1} .giftedTime strong`).text(res.giftNum);
+                })
+                var thisListTo3 = res.data.thisWeekTop.slice(0, 3);
+                var notThisListTo3 = res.data.thisWeekTop.slice(3);
+                if (thisListTo3.length < 3) {
+                    let arr = new Array(3 - thisListTo3.length).fill({
+                        picUrl: './images/null.png',
+                        giftName: 'Vacant',
+                        giftNum: "Vacant"
+                    })
+                    thisListTo3.push(...arr)
+                }
+                // 处理本周前三
+                thisListTo3.forEach((res, i) => {
+                    $(`.page1 .thisWeek .top .top${i + 1} .tx`).attr('src', res.picUrl);
+                    $(`.page1 .thisWeek .top .top${i + 1} .name strong`).text(res.giftName);
+                    $(`.page1 .thisWeek .top .top${i + 1} .giftedTime strong`).text(res.giftNum);
+                })
+                // 本周非前三
+                $('.page1 .thisWeek .content ul li').remove();
+                var str = '';
+                notThisListTo3.forEach(res => {
+                    str += `
+                        <li>
+                            <div class="num">${res.rank}</div>
+                            <img src="${res.picUrl}" alt="" class="tx">
+                            <div class="giftInfo">
+                                <p>${langReplace(localLang.demoModule.text5)}${res.giftName}</p>
+                                <b>${langReplace(localLang.demoModule.text6)}${res.giftNum}</b>
+                            </div>
+                        </li>
+                    `
+                })
+                $('.page1 .thisWeek .content ul').append(str);
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 第二Tab接口
+function giftRank() {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/activity/h5/special/gift/rank',
+        data: { uid: pubInfo.uid },
+        success(res) {
+            if (res.code === 200) {
+                // 处理倒计时
+                countup2(res.data.endTime - res.timestamp);
+                // 处理自己
+                $('.page2 .myList .top .my .tx').attr('src', res.data.myRank.avatar);
+                $('.page2 .myList .top .my p').text(res.data.myRank.name);
+                $('.page2 .myList .top .my b').text(langReplace(localLang.demoModule.text6) + unitProcessingAr(res.data.myRank.totalNum, 1));
+                $('.page2 .myList .top .my span').text(langReplace(localLang.demoModule.text25) + unitProcessingAr(res.data.myRank.totalGoldNum, 1));
+                // 处理列表
+                $('.page2 .myList .content ul li').remove();
+                var str = '';
+                res.data.rankList.forEach(res => {
+                    str += `
+                        <li>
+                            <div class="num">${res.rank}</div>
+                            <img style="display:${res.rank <= 3 ? 'block' : 'none'}" src="./images/ts${res.rank}.png" alt="" class="ts">
+                            <img src="${res.avatar}" alt="" class="tx">
+                            <span>${res.name}</span>
+                            <div class="giftInfo">
+                                <p>${langReplace(localLang.demoModule.text6)}${unitProcessingAr(res.totalNum, 1)}</p>
+                                <b>${langReplace(localLang.demoModule.text25)}${unitProcessingAr(res.totalGoldNum, 1)}</b>
+                            </div>
+                        </li>
+                    `
+                })
+                $('.page2 .myList .content ul').append(str);
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// tab切换
+$('.tabBox div').click(function () {
+    var i = $(this).index() + 1;
+    $(this).addClass('act').siblings().removeClass('act');
+    $(`.page1,.page2`).hide();
+    $(`.page${i}`).show();
+})
+// 倒計時
+function countup1(leftTime, type) {
+    clearTimeout(countupTime1)
+    //獲取當前時間
+    // var now = nowTime;
+    var d = 0;
+    var h = 0;
+    var m = 0;
+    var s = 0;
+    //定義變數 d,h,m,s保存倒計時的時間
+    var d, h, m, s;
+    //遞歸每秒調⽤countTime⽅法，顯⽰動態時間效果 
+    if (leftTime > 0) {
+        d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
+        h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
+        m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
+        s = getzf(Math.floor(leftTime / 1000 % 60));
+        //將倒計時賦值到div中
+        $(`.page1 .thisWeek .top .countdown .day span`).text(d);
+        $(`.page1 .thisWeek .top .countdown .hours span`).text(h);
+        $(`.page1 .thisWeek .top .countdown .mins span`).text(m);
+        $(`.page1 .thisWeek .top .countdown .secs span`).text(s);
+    } else {
+        rankGift();
+    }
+    if (leftTime > 0) {
+        leftTime = leftTime - 1000;
+    }
+    countupTime1 = setTimeout(function () {
+        countup1(leftTime);
+    }, 1000);
+}
+function countup2(leftTime, type) {
+    clearTimeout(countupTime2)
+    //獲取當前時間
+    // var now = nowTime;
+    var d = 0;
+    var h = 0;
+    var m = 0;
+    var s = 0;
+    //定義變數 d,h,m,s保存倒計時的時間
+    var d, h, m, s;
+    //遞歸每秒調⽤countTime⽅法，顯⽰動態時間效果 
+    if (leftTime > 0) {
+        d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
+        h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
+        m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
+        s = getzf(Math.floor(leftTime / 1000 % 60));
+        //將倒計時賦值到div中
+        $(`.page2 .myList .top .countdown .day span`).text(d);
+        $(`.page2 .myList .top .countdown .hours span`).text(h);
+        $(`.page2 .myList .top .countdown .mins span`).text(m);
+        $(`.page2 .myList .top .countdown .secs span`).text(s);
+    } else {
+        giftRank();
+    }
+    if (leftTime > 0) {
+        leftTime = leftTime - 1000;
+    }
+    countupTime2 = setTimeout(function () {
+        countup2(leftTime);
+    }, 1000);
+}
+//补0操作  
+function getzf(num) {
+    if (parseInt(num) < 10) {
+        num = '0' + num;
+    }
+    return num;
+}
+// 打开规则
+$('.page2 .myList .top .rule').click(function () {
+    $('.ruleBox').show();
+    bodyScroolFun(true);
+})
+// 关闭规则
+$('.ruleBox .rule_in .close').click(function () {
+    $('.ruleBox').hide();
+    bodyScroolFun(false);
+})
+// 打开规则
+$('.page1 .thisWeek .top .rule').click(function () {
+    $('.ruleBox2').show();
+    bodyScroolFun(true);
+})
+// 关闭规则
+$('.ruleBox2 .rule_in .close').click(function () {
+    $('.ruleBox2').hide();
+    bodyScroolFun(false);
+})
+// 打开奖励
+$('.page1 .thisWeek .top .reward').click(function () {
+    $('.rewardBox').show();
+    bodyScroolFun(true);
+})
+// 关闭奖励
+$('.rewardBox .rule_in .close').click(function () {
+    $('.rewardBox').hide();
+    bodyScroolFun(false);
+})
+// 打开奖励
+$('.page2 .myList .top .reward').click(function () {
+    $('.rewardBox2').show();
+    bodyScroolFun(true);
+})
+// 关闭奖励
+$('.rewardBox2 .rule_in .close').click(function () {
+    $('.rewardBox2').hide();
+    $('.rewardBox2 .rule_in .box .img6 .why span,.rewardBox2 .rule_in .box .img5 .why span,.rewardBox2 .rule_in .box .img4 .why span').hide();
+    bodyScroolFun(false);
+})
+
+// 奖励tab切换
+$('.rewardBox2 .rule_in .stabBox div').click(function () {
+    var i = $(this).index() + 1;
+    $('.text23').text(langReplace(localLang.demoModule[`texts${i}`]));
+    $(this).addClass('act').siblings().removeClass();
+    $('.rewardBox2 .rule_in .box img').hide();
+    $('.rewardBox2 .rule_in .box .boxs').hide();
+    $(`.rewardBox2 .rule_in .box .img${i}`).css('display', 'block');
+})
+$('.rewardBox2 .rule_in .box img,.rewardBox2 .rule_in .box div').click(function(){
+    $('.rewardBox2 .rule_in .box .img6 .why span').hide();
+    $('.rewardBox2 .rule_in .box .img5 .why span').hide();
+    $('.rewardBox2 .rule_in .box .img4 .why span').hide();
+    return false;
+})
+$('.rewardBox2 .rule_in .box .img6 .why,.rewardBox2 .rule_in .box .img5 .why,.rewardBox2 .rule_in .box .img4 .why').click(function () {
+    $('.rewardBox2 .rule_in .box .img6 .why span,.rewardBox2 .rule_in .box .img5 .why span,.rewardBox2 .rule_in .box .img4 .why span').css('display', 'block');
+    return false;
+})
--- a/view/molistar/activity/customizedGift/local/ar.js
+++ b/view/molistar/activity/customizedGift/local/ar.js
@@ -0,0 +1,51 @@
+// 阿拉伯
+langAr = {
+        // 模块
+        demoModule: {
+                layerIndex1: `جار التحميل...`,
+                layerIndex2: `نجاح`,
+                layerIndex3: `خطأ في الشبكة`,
+                text1: `مسابقة الهدايا المخصصة`,
+                text2: `مقدمة النشاط`,
+                text3: `<p>هل فكرت يومًا في إرسال هدية مخصصة تعبر عن مشاعرك؟</p>
+<p>الآن، الفرصة قد جاءت! مسابقتنا للهدايا المخصصة تتيح لك تحميل هداياك المخصصة والحصول على التقدير في المسابقة. نتطلع إلى إبداعك وحماسك!</p>`,
+                text4: `أفضل 3 هدايا الأسبوع الماضي`,
+                text5: `اسم الهدية:`,
+                text6: `وقت الإهداء:`,
+                text7: `الهدايا المخصصة الشائعة`,
+                text8: `داعمي الهدايا المخصصة`,
+                text9: `القواعد`,
+                text10: `المكافأة`,
+                text11: `العد التنازلي`,
+                text12: `يوم`,
+                text13: `ساعة`,
+                text14: `دقيقة`,
+                text15: `ثانية`,
+                text16: `العد التنازلي`,
+                text17: `<p>1. وقت النشاط: من اليوم الأول من هذا الشهر إلى نهاية الشهر الثاني (GMT+3)</p>
+<p>2. احتساب عدد الهدايا المخصصة المرسلة خلال الحدث. كلما زادت الهدايا المرسلة، زادت المكافآت التي ستحصل عليها.</p>
+<p>3. هذا الحدث لا علاقة له بـ Google أو Apple</p>`,
+                text18: `<p>1. وقت بدء الحدث: من الساعة 00:00 كل يوم اثنين إلى الساعة 23:59 كل يوم أحد (GMT+3)</p>
+<p>2. أفضل 3 هدايا مخصصة شائعة ستفوز بجوائز سخية.</p>
+<p>3. هذا الحدث لا علاقة له بـ Google أو Apple</p>`,
+                text19: `المكافأة 1: عندما تحتل الهدية المخصصة المرتبة الأولى في قائمة هدايا هذا الأسبوع، سيتم تخصيص الهدية كصفحة بداية وبانر.`,
+                text20: `المكافأة 2: عندما تكون الهدايا المخصصة ضمن المراكز الثلاثة الأولى لهذا الأسبوع، سيتم تحديثها في لوحة الهدايا كهدية حصرية مخصصة.`,
+                text21: `المكافأة 3: عندما تكون الهدايا المخصصة ضمن المراكز الثلاثة الأولى لهذا الأسبوع، سيكون هناك منطقة مخصصة في صفحة الحدث لعرض الهدايا المقابلة.`,
+                text22: `المكافأة 4: عندما تكون الهدايا المخصصة ضمن المراكز الثلاثة الأولى لهذا الأسبوع، ستحظى هذه الهدايا الثلاثة بظهور خاص على لوحة الهدايا المخصصة.`,
+                text23: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 7000، يمكنك الحصول على المكافآت التالية!`,
+                texts6: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 7000 مرة، يمكنك الحصول على المكافآت التالية!`,
+                texts5: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 5600 مرة، يمكنك الحصول على المكافآت التالية!`,
+                texts4: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 4900 مرة، يمكنك الحصول على المكافآت التالية!`,
+                texts3: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 3500 مرة، يمكنك الحصول على المكافآت التالية!`,
+                texts2: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 2100 مرة، يمكنك الحصول على المكافآت التالية!`,
+                texts1: `خلال الحدث، إذا وصل عدد الهدايا المخصصة المرسلة إلى 700 مرة، يمكنك الحصول على المكافآت التالية!`,
+                text24: `يرجى الاتصال بخدمة العملاء لدينا، وتحميل فيديو سيارة مدته 5 ثوانٍ، وتخصيص سيارتك الخاصة.`,
+                text244: `يرجى الاتصال بخدمة العملاء لدينا، وتحميل فيديو سيارة مدته 8 ثوانٍ، وتخصيص سيارتك الخاصة.`,
+                text2444: `يرجى الاتصال بخدمة العملاء لدينا، وتحميل فيديو سيارة مدته 10 ثوانٍ، وتخصيص سيارتك الخاصة.`,
+                text25: `عدد عملات الهدايا:`,
+                img1: `./images/reward1-ar.png`,
+                img2: `./images/1-ar.png`,
+                img3: `./images/2-ar.png`,
+                img4: `./images/3-ar.png`,
+        }
+}
--- a/view/molistar/activity/customizedGift/local/en.js
+++ b/view/molistar/activity/customizedGift/local/en.js
@@ -0,0 +1,79 @@
+langEn = {
+    demoModule: {
+        layerIndex1: `Loading...`,
+        layerIndex2: `Success`,
+        layerIndex3: `Network error`,
+        text1: `Custom Gift Competition`,
+        text2: `Activity introduction`,
+        text3: `<p>Have you ever thought about sending a custom gift that expresses your feelings?</p>
+        <p>Now, the opportunity has come! Our customized gift competition allows you to upload your own customized
+            gifts and gain recognition in the competition. Looking forward to your creativity and enthusiasm!</p>`,
+        text4: `Top 3 Gifts Last Week`,
+        text5: `Gift name:`,
+        text6: `Gifted time:`,
+        text7: `Popular Custom Gifts`,
+        text8: `Custom Gifts Supporter`,
+        text9: `Rule`,
+        text10: `Reward`,
+        text11: `Countdown`,
+        text12: `Day`,
+        text13: `Hours`,
+        text14: `Mins`,
+        text15: `Secs`,
+        text16: `Countdown`,
+        text17: `<p>1. Event time: the 1st of this month to the end of the second month(GMT+3)</p>
+        <p>2. Calculate the number of customized gifts sent during the event. The more gifts sent, the more you
+            will get.</p>
+        <p>3. This event has nothing to do with Google and Apple</p>`,
+        text18: `<p>1 Event start time: 00:00 every Monday - 23:59 every Sunday (GMT+3)</p>
+        <p>2. The Top3 popular customized gifts will get generous gifts.</p>
+        <p>3 This event has nothing to do with Google and Apple</p>`,
+        text19: `Reward 1: When the customized gift ranks first on this week’s gift list, the gift will
+        be customized
+        as a start page and banner.`,
+        text20: `Reward 2: When the customized gifts are among the top three of the week, they will be
+        updated to the
+        gift panel as an exclusive customized lucky gift.`,
+        text21: `Reward 3: When the customized gifts are among the top
+        three of the
+        week, there will be a specific area on the event page to display the corresponding gifts.`,
+        text22: `Reward 4: When the customized gifts are the top three of the week, these three gifts
+        will have a
+        special presence on the customized gift panel.`,
+        text23: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 7000, you can get the following rewards!`,
+        texts6: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 7000, you can get the following rewards!`,
+        texts5: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 5600, you can get the following rewards!`,
+        texts4: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 4900, you can get the following rewards!`,
+        texts3: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 3500, you can get the following rewards!`,
+        texts2: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 2100, you can get the following rewards!`,
+        texts1: `During the event, if the number of customized gifts sent
+        in the gift
+        times reaches 700, you can get the following rewards!`,
+        text24: `Please contact our customer service, upload a 5-second car video, and
+        customize your own
+        car.`,
+        text244: `Please contact our customer service, upload a 8-second car video, and
+        customize your own
+        car.`,
+        text2444: `Please contact our customer service, upload a 10-second car video, and
+        customize your own
+        car.`,
+        text25: `Coins of Gifted:`,
+        img1: `./images/reward1.png`,
+        img2: `./images/1.png`,
+        img3: `./images/2.png`,
+        img4: `./images/3.png`,
+    }
+}
--- a/view/molistar/activity/customizedGift/local/zh.js
+++ b/view/molistar/activity/customizedGift/local/zh.js
@@ -0,0 +1,51 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        layerIndex1: `加载中...`,
+        layerIndex2: `成功`,
+        layerIndex3: `网络错误`,
+        text1: `客製禮物競賽`,
+        text2: `活動介紹`,
+        text3: `<p>您是否曾想過送出一份能表達您情感的客製禮物？</p>
+<p>現在，機會來了！我們的客製禮物競賽允許您上傳自己的客製禮物，並在競賽中獲得認可。期待您的創意和熱情！</p>`,
+        text4: `上週前三名禮物`,
+        text5: `禮物名稱：`,
+        text6: `送出時間：`,
+        text7: `熱門客製禮物`,
+        text8: `客製禮物支持者`,
+        text9: `規則`,
+        text10: `獎勵`,
+        text11: `倒計時`,
+        text12: `天`,
+        text13: `小時`,
+        text14: `分鐘`,
+        text15: `秒`,
+        text16: `倒計時`,
+        text17: `<p>1. 活動時間：本月1日至第二個月月底（GMT+3）</p>
+<p>2. 計算活動期間送出的客製禮物數量。送出的禮物越多，獲得的獎勵越多。</p>
+<p>3. 此活動與 Google 和 Apple 無關</p>`,
+        text18: `<p>1. 活動開始時間：每週一 00:00 - 每週日 23:59（GMT+3）</p>
+<p>2. 最受歡迎的前三名客製禮物將獲得豐厚禮品。</p>
+<p>3. 此活動與 Google 和 Apple 無關</p>`,
+        text19: `獎勵1：當客製禮物在本週的禮物榜上排名第一時，該禮物將被客製為起始頁面和橫幅。`,
+        text20: `獎勵2：當客製禮物進入本週前三名時，將被更新到禮物面板，作為專屬的客製幸運禮物。`,
+        text21: `獎勵3：當客製禮物進入本週前三名時，活動頁面上將有專屬區域展示相應禮物。`,
+        text22: `獎勵4：當客製禮物為本週前三名時，這三份禮物將在客製禮物面板上有特別展示。`,
+        text23: `活動期間，如果客製禮物的送出次數達到7000次，您將獲得以下獎勵！`,
+        texts6: `在活動期間，如果送出的定制禮物次數達到 7000 次，您可以獲得以下獎勵！`,
+        texts5: `在活動期間，如果送出的定制禮物次數達到 5600 次，您可以獲得以下獎勵！`,
+        texts4: `在活動期間，如果送出的定制禮物次數達到 4900 次，您可以獲得以下獎勵！`,
+        texts3: `在活動期間，如果送出的定制禮物次數達到 3500 次，您可以獲得以下獎勵！`,
+        texts2: `在活動期間，如果送出的定制禮物次數達到 2100 次，您可以獲得以下獎勵！`,
+        texts1: `在活動期間，如果送出的定制禮物次數達到 700 次，您可以獲得以下獎勵！`,
+        text24: `請聯繫我們的客服，並上傳一段5秒的汽車影片，客製化您的專屬汽車。`,
+        text244: `請聯繫我們的客服，並上傳一段8秒的汽車影片，客製化您的專屬汽車。`,
+        text2444: `請聯繫我們的客服，並上傳一段10秒的汽車影片，客製化您的專屬汽車。`,
+        text25: `禮物的硬幣數：`,
+        img1: `./images/reward1.png`,
+        img2: `./images/1.png`,
+        img3: `./images/2.png`,
+        img4: `./images/3.png`,
+    }
+}
--- a/view/molistar/common/local/langHandler.js
+++ b/view/molistar/common/local/langHandler.js
@@ -1,7 +1,7 @@
 /**
 * 初始化当前语言 
 */
-function initLocalLang () {
+function initLocalLang() {
    const lang = localStorage.getItem('lang')
    // if (lang === 'zh' || window.location.href.match('=zh-CN')) {
    //     console.log("langHandler" + '简体')
@@ -10,7 +10,7 @@ function initLocalLang () {
    //     window.lang.code = 'zh-CN'
    //     window.lang.defaults = false
    // } else
-     if (lang === 'zh' || window.location.href.match('=zh')) {
+    if (lang === 'zh' || window.location.href.match('=zh')) {
        console.log("langHandler" + '繁体')
        window.lang = langZh
        window.lang.code = 'zh'
@@ -33,16 +33,19 @@ function initLocalLang () {
        window.lang = langId
        window.lang.code = 'id'
        window.lang.defaults = false
-    }else if (lang === 'tr' || window.location.href.match('=tr')) {
-        // 土耳其
-        // console.log("langHandler" + '土耳其')
-        // window.lang = langTr
-        // window.lang.code = 'tr'
-        // window.lang.defaults = false
-        console.log("langHandler" + '英语/土耳其')
-        window.lang = langEn
-        window.lang.code = 'en'
-        window.lang.defaults = false
+    } else if (lang === 'tr' || window.location.href.match('=tr')) {
+        if (window.location.href.match('inform') || window.location.href.match('superId') || window.location.href.match('newWeekStar') || window.location.href.match('home')|| window.location.href.match('pay')) {
+            // 土耳其
+            console.log("langHandler" + '土耳其')
+            window.lang = langTr
+            window.lang.code = 'tr'
+            window.lang.defaults = false
+        } else {
+            console.log("langHandler" + '英语/土耳其')
+            window.lang = langEn
+            window.lang.code = 'en'
+            window.lang.defaults = false
+        }
    } else {
        console.log("langHandler" + '默认英语')
        window.lang = langEn
--- a/view/molistar/home/css/index.css
+++ b/view/molistar/home/css/index.css
@@ -6,109 +6,244 @@
  html {
    width: 100%;
    height: 100%;
-    background: linear-gradient(180deg, #61C9A0 0%, #309470 100%);
    font-family: Avenir, Avenir;
    cursor: pointer;
  }
  body .container,
  html .container {
-    position: relative;
-  }
-  body .pc-bg,
-  html .pc-bg {
-    display: none;
-  }
-  body .homePc,
-  html .homePc {
    width: 100%;
-    height: 10rem;
-    background: url(../images/pcBgBig.png) no-repeat;
-    background-size: 100% 100%;
+    height: 100vh;
+    position: relative;
+    overflow-y: hidden;
+  }
+  body .container .pagesBox,
+  html .container .pagesBox {
+    width: 100%;
+    height: 100vh;
+    transition: all .5s;
+    transform: translateY(0%);
+  }
+  body .container .pagesBox .page1,
+  html .container .pagesBox .page1 {
+    width: 100%;
+    height: 100%;
+    background: url(../images/pc1.png) no-repeat center center;
+    background-size: cover;
    position: relative;
  }
-  body .homePc .diamound,
-  html .homePc .diamound {
-    padding: 0 0.26667rem;
-    height: 0.5rem;
-    line-height: 0.46667rem;
-    color: #FFFFFF;
-    font-size: 0.25rem;
-    text-align: center;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 0.53333rem;
-    box-sizing: border-box;
-    border: 1px solid #fff;
+  body .container .pagesBox .page1 .logoPc,
+  html .container .pagesBox .page1 .logoPc {
+    width: 2.69333rem;
+    height: 0.93333rem;
    position: absolute;
-    right: 3.46667rem;
-    top: 0.3rem;
-    vertical-align: middle;
+    left: 0.85333rem;
+    top: 0.37333rem;
  }
-  body .homePc .diamound img,
-  html .homePc .diamound img {
+  body .container .pagesBox .page1 .tab,
+  html .container .pagesBox .page1 .tab {
+    width: 4.26667rem;
+    height: 0.41333rem;
+    line-height: 0.41333rem;
+    display: flex;
+    justify-content: space-between;
+    color: #fff;
+    font-size: 0.29333rem;
+    font-weight: 500;
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    top: 0.6rem;
+  }
+  body .container .pagesBox .page1 .tab p,
+  html .container .pagesBox .page1 .tab p {
+    position: relative;
+  }
+  body .container .pagesBox .page1 .tab p span,
+  html .container .pagesBox .page1 .tab p span {
+    width: 0.46667rem;
+    height: 0.09333rem;
+    border-radius: 0.09333rem;
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: -0.26667rem;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+  }
+  body .container .pagesBox .page1 .tab .tex,
+  html .container .pagesBox .page1 .tab .tex {
+    opacity: 0.5;
+  }
+  body .container .pagesBox .page1 .recharge,
+  html .container .pagesBox .page1 .recharge {
+    width: 1.62667rem;
+    height: 0.48rem;
+    line-height: 0.42667rem;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+    text-align: center;
+    color: #fff;
+    font-size: 0.21333rem;
+    border-radius: 0.48rem;
+    position: absolute;
+    top: 0.6rem;
+    right: 2.44rem;
+  }
+  body .container .pagesBox .page1 .recharge img,
+  html .container .pagesBox .page1 .recharge img {
+    width: 0.29333rem;
+    height: 0.29333rem;
    display: inline-block;
-    width: 0.50667rem;
-    height: 0.50667rem;
    vertical-align: middle;
-    margin-top: -0.01rem;
+    margin-right: 0.02667rem;
  }
-  body .homePc .language,
-  html .homePc .language {
+  body .container .pagesBox .page1 .recharge span,
+  html .container .pagesBox .page1 .recharge span {
+    vertical-align: middle;
+  }
+  body .container .pagesBox .page1 .language,
+  html .container .pagesBox .page1 .language {
+    position: absolute;
+    right: 0.85333rem;
+    top: 0.6rem;
+    width: 1.32rem;
+    height: 0.48rem;
+    border-radius: 0.48rem;
+    line-height: 0.48rem;
+    background: rgba(255, 255, 255, 0.2);
    color: #fff;
-    position: absolute;
-    height: 0.5rem;
-    line-height: 0.5rem;
-    right: 1rem;
-    top: .3rem;
-    font-size: 0.25333rem;
-    font-weight: bold;
+    text-align: center;
+    font-size: 0.21333rem;
+    font-weight: 400;
  }
-  body .homePc .privacy,
-  html .homePc .privacy {
-    color: #fff;
-    position: absolute;
-    height: 0.5rem;
-    line-height: 0.5rem;
-    left: 6.4rem;
-    top: .3rem;
-    width: 3rem;
-  }
-  body .homePc .pcIos,
-  html .homePc .pcIos {
-    width: 2.9rem;
-    height: 0.64rem;
-    position: absolute;
-    right: 5rem;
-    top: 5.855rem;
-  }
-  body .homePc .pcAnd,
-  html .homePc .pcAnd {
-    width: 2.9rem;
-    height: 0.64rem;
-    position: absolute;
-    right: 5rem;
-    top: 6.79rem;
-  }
-  body .bootom,
-  html .bootom {
+  body .container .pagesBox .page1 .title,
+  html .container .pagesBox .page1 .title {
    width: 100%;
-    position: fixed;
+    text-align: center;
+    font-size: 0.8rem;
+    color: #fff;
+    font-weight: 600;
+    position: absolute;
    left: 0;
-    bottom: 0;
-    background: #0F0B27;
+    top: 5.26667rem;
+  }
+  body .container .pagesBox .page1 h3,
+  html .container .pagesBox .page1 h3 {
+    width: 100%;
+    text-align: center;
+    font-size: 0.58667rem;
+    color: #fff;
+    font-weight: 400;
+    position: absolute;
+    left: 0;
+    top: 6.66667rem;
+  }
+  body .container .pagesBox .page1 .h5Ios,
+  html .container .pagesBox .page1 .h5Ios {
+    width: 4.44rem;
+    height: 1.06667rem;
+    position: absolute;
+    left: 7.33333rem;
+    top: 8.45333rem;
+  }
+  body .container .pagesBox .page1 .h5And,
+  html .container .pagesBox .page1 .h5And {
+    width: 4.44rem;
+    height: 1.06667rem;
+    position: absolute;
+    right: 7.33333rem;
+    top: 8.45333rem;
+  }
+  body .container .pagesBox .page1 .team,
+  html .container .pagesBox .page1 .team {
+    width: 100%;
    text-align: center;
    color: #fff;
-    padding-bottom: 0.2rem;
-    padding-top: 0.1rem;
+    opacity: 0.6;
+    font-size: 0.21333rem;
+    font-weight: 400;
+    position: absolute;
+    left: 0;
+    bottom: 0.4rem;
  }
-  body .bootom p,
-  html .bootom p {
-    margin-top: 0.1rem;
-    font-size: 0.15rem;
-    color: #fff;
+  body .container .pagesBox .page2,
+  html .container .pagesBox .page2 {
+    width: 100%;
+    height: 100%;
+    background: url(../images/pc2.png) no-repeat center center;
+    background-size: cover;
+    position: relative;
  }
-  body .bootom p a,
-  html .bootom p a {
+  body .container .pagesBox .page2 .title,
+  html .container .pagesBox .page2 .title {
+    width: 100%;
+    text-align: center;
+    font-size: 0.8rem;
    color: #fff;
+    font-weight: 600;
+    position: absolute;
+    left: 0;
+    top: 0.86667rem;
+  }
+  body .container .pagesBox .page2 img,
+  html .container .pagesBox .page2 img {
+    position: absolute;
+    width: 16rem;
+    top: 2.66667rem;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  body .container .pagesBox .page3,
+  html .container .pagesBox .page3 {
+    width: 100%;
+    height: 100%;
+    background: url(../images/pc3.png) no-repeat center center;
+    background-size: cover;
+    position: relative;
+  }
+  body .container .pagesBox .page3 .title,
+  html .container .pagesBox .page3 .title {
+    width: 100%;
+    text-align: center;
+    font-size: 0.8rem;
+    color: #fff;
+    font-weight: 600;
+    position: absolute;
+    left: 0;
+    top: 0.86667rem;
+  }
+  body .container .pagesBox .page3 img,
+  html .container .pagesBox .page3 img {
+    position: absolute;
+    width: 16rem;
+    top: 2.66667rem;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  body .container .pagesBox .page4,
+  html .container .pagesBox .page4 {
+    width: 100%;
+    height: 100%;
+    background: url(../images/pc4.png) no-repeat center center;
+    background-size: cover;
+    position: relative;
+  }
+  body .container .pagesBox .page4 .title,
+  html .container .pagesBox .page4 .title {
+    width: 100%;
+    text-align: center;
+    font-size: 0.8rem;
+    color: #fff;
+    font-weight: 600;
+    position: absolute;
+    left: 0;
+    top: 0.86667rem;
+  }
+  body .container .pagesBox .page4 img,
+  html .container .pagesBox .page4 img {
+    position: absolute;
+    width: 16rem;
+    top: 2.66667rem;
+    left: 50%;
+    transform: translateX(-50%);
  }
 }

@@ -130,7 +265,7 @@
    width: 100%;
    height: 1.2rem;
    box-sizing: border-box;
-    padding: 0 0.53333rem;
+    padding: 0 0.42667rem;
    margin: 0.26667rem auto 0;
    z-index: 3;
  }
@@ -144,6 +279,7 @@
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
+    display: none;
  }
  body .header .logo,
  html .header .logo {
@@ -164,18 +300,18 @@
  body .header .diamound,
  html .header .diamound {
    padding: 0 0.26667rem;
-    height: 0.74667rem;
-    line-height: 0.74667rem;
+    height: 0.8rem;
+    line-height: 0.8rem;
    box-sizing: border-box;
-    border: 1px solid #fff;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
    vertical-align: middle;
    color: #fff;
    font-size: 0.32rem;
    float: right;
    margin-top: 0.05333rem;
-    margin-right: 0.42667rem;
+    margin-right: 0.24rem;
    text-align: center;
-    border-radius: 0.74667rem;
+    border-radius: 0.8rem;
  }
  body .header .diamound img,
  html .header .diamound img {
@@ -192,15 +328,24 @@
    height: 0.53333rem;
    display: block;
    margin-top: 0.16rem;
+    display: none;
  }
  body .header .language,
  html .header .language {
    float: right;
-    color: #fff;
-    height: 0.53333rem;
-    line-height: 0.53333rem;
-    margin-top: 0.16rem;
+    width: 2.18667rem;
+    height: 0.8rem;
+    border-radius: 0.8rem;
+    line-height: 0.8rem;
+    margin-top: 0.05333rem;
    margin-right: 0.26667rem;
+    background: rgba(255, 255, 255, 0.2);
+    color: #fff;
+    text-align: center;
+  }
+  body .header .language b,
+  html .header .language b {
+    font-size: 0.32rem;
  }
  body .h5,
  html .h5 {
@@ -225,6 +370,80 @@
    background: url(../images/h51.png) no-repeat center;
    background-size: 10rem 100%;
  }
+  body .h5 .pagesBox .page1 .tab,
+  html .h5 .pagesBox .page1 .tab {
+    width: 70%;
+    display: flex;
+    position: absolute;
+    top: 2.13333rem;
+    height: 0.58667rem;
+    line-height: 0.58667rem;
+    left: 50%;
+    transform: translateX(-50%);
+    justify-content: space-evenly;
+  }
+  body .h5 .pagesBox .page1 .tab p,
+  html .h5 .pagesBox .page1 .tab p {
+    color: #FFFFFF;
+    opacity: 0.2;
+    position: relative;
+    font-size: 0.42667rem;
+    white-space: nowrap;
+  }
+  body .h5 .pagesBox .page1 .tab p span,
+  html .h5 .pagesBox .page1 .tab p span {
+    width: 0.58667rem;
+    height: 0.13333rem;
+    border-radius: 0.13333rem;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: -0.26667rem;
+    font-size: 0.42667rem;
+    font-weight: 500;
+  }
+  body .h5 .pagesBox .page1 .tab .act,
+  html .h5 .pagesBox .page1 .tab .act {
+    opacity: 1;
+  }
+  body .h5 .pagesBox .page1 .title,
+  html .h5 .pagesBox .page1 .title {
+    width: 100%;
+    height: 1.12rem;
+    text-align: center;
+    color: #fff;
+    font-weight: 600;
+    font-size: 0.8rem;
+    position: absolute;
+    top: 7.78667rem;
+    left: 0;
+  }
+  body .h5 .pagesBox .page1 .tex,
+  html .h5 .pagesBox .page1 .tex {
+    width: 9.14667rem;
+    height: 1.49333rem;
+    line-height: 0.74667rem;
+    position: absolute;
+    top: 9.25333rem;
+    left: 50%;
+    transform: translateX(-50%);
+    color: #fff;
+    text-align: center;
+    opacity: 0.6;
+    font-size: 0.53333rem;
+    font-weight: 400;
+  }
+  body .h5 .pagesBox .page1 .team,
+  html .h5 .pagesBox .page1 .team {
+    width: 100%;
+    left: 0;
+    bottom: 1.09333rem;
+    text-align: center;
+    color: #fff;
+    opacity: 0.8;
+    position: absolute;
+  }
  body .h5 .pagesBox .page1 .pageTxte1,
  html .h5 .pagesBox .page1 .pageTxte1 {
    width: 6.42667rem;
@@ -243,8 +462,8 @@
  }
  body .h5 .pagesBox .page1 .downioad,
  html .h5 .pagesBox .page1 .downioad {
-    width: 5.52rem;
-    height: 1.22667rem;
+    width: 4.44rem;
+    height: 1.06667rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
@@ -265,61 +484,37 @@
    height: 100%;
    position: relative;
    overflow: hidden;
-    background: url(../images/h51.png) no-repeat center;
+    background: url(../images/h52.png) no-repeat center;
    background-size: 10rem 100%;
  }
-  body .h5 .pagesBox .page2 .pageText2,
-  html .h5 .pagesBox .page2 .pageText2 {
-    width: 10rem;
-    height: 10.85333rem;
-    position: relative;
-    top: 3.44rem;
-    margin: 0 auto;
-    display: block;
-    display: none;
-  }
-  body .h5 .pagesBox .page2 .page2_in,
-  html .h5 .pagesBox .page2 .page2_in {
-    width: 10rem;
-    height: 11.65333rem;
+  body .h5 .pagesBox .page2 .title,
+  html .h5 .pagesBox .page2 .title {
+    width: 100%;
+    height: 1.12rem;
+    text-align: center;
+    color: #fff;
+    font-weight: 600;
+    font-size: 0.8rem;
    position: absolute;
+    top: 3.06667rem;
+    left: 0;
+  }
+  body .h5 .pagesBox .page2 .img,
+  html .h5 .pagesBox .page2 .img {
+    position: absolute;
+    width: 10rem;
+    top: 4.77333rem;
    left: 50%;
    transform: translateX(-50%);
-    top: 2.50667rem;
-  }
-  body .h5 .pagesBox .page2 .pagetx1,
-  html .h5 .pagesBox .page2 .pagetx1 {
-    width: 6.34667rem;
-    height: 4.10667rem;
-    position: absolute;
-    left: 3.12rem;
-    top: 4.56rem;
-  }
-  body .h5 .pagesBox .page2 .pagetx2,
-  html .h5 .pagesBox .page2 .pagetx2 {
-    width: 6.34667rem;
-    height: 4.10667rem;
-    position: absolute;
-    left: 0.53333rem;
-    top: 9.17333rem;
  }
  body .h5 .pagesBox .page2 .downioad,
  html .h5 .pagesBox .page2 .downioad {
-    width: 5.52rem;
-    height: 1.12rem;
+    width: 4.44rem;
+    height: 1.06667rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.66667rem;
-    display: block;
-  }
-  body .h5 .pagesBox .page2 .down,
-  html .h5 .pagesBox .page2 .down {
-    width: 0.50667rem;
-    height: 0.37333rem;
-    position: absolute;
-    left: 48%;
-    bottom: 0.26667rem;
  }
  body .h5 .pagesBox .page3,
  html .h5 .pagesBox .page3 {
@@ -327,77 +522,37 @@
    height: 100%;
    position: relative;
    overflow: hidden;
-    background: url(../images/h51.png) no-repeat center;
+    background: url(../images/h53.png) no-repeat center;
    background-size: 10rem 100%;
  }
-  body .h5 .pagesBox .page3 .pageText3,
-  html .h5 .pagesBox .page3 .pageText3 {
-    width: 6.82667rem;
-    height: 1.52rem;
-    position: relative;
-    display: block;
-    margin: 0 auto;
-    top: 2.8rem;
-    display: none;
-  }
-  body .h5 .pagesBox .page3 .page3_in,
-  html .h5 .pagesBox .page3 .page3_in {
-    width: 10rem;
-    height: 11.65333rem;
+  body .h5 .pagesBox .page3 .title,
+  html .h5 .pagesBox .page3 .title {
+    width: 100%;
+    height: 1.12rem;
+    text-align: center;
+    color: #fff;
+    font-weight: 600;
+    font-size: 0.8rem;
    position: absolute;
+    top: 3.06667rem;
+    left: 0;
+  }
+  body .h5 .pagesBox .page3 .img,
+  html .h5 .pagesBox .page3 .img {
+    position: absolute;
+    width: 10rem;
+    top: 4.77333rem;
    left: 50%;
    transform: translateX(-50%);
-    top: 2.50667rem;
-  }
-  body .h5 .pagesBox .page3 .page3Icon1,
-  html .h5 .pagesBox .page3 .page3Icon1 {
-    width: 4.09333rem;
-    height: 2.93333rem;
-    position: absolute;
-    left: 5.68rem;
-    top: 5.65333rem;
-  }
-  body .h5 .pagesBox .page3 .page3Icon2,
-  html .h5 .pagesBox .page3 .page3Icon2 {
-    width: 4.32rem;
-    height: 3.09333rem;
-    position: absolute;
-    left: 0rem;
-    top: 4.85333rem;
-  }
-  body .h5 .pagesBox .page3 .page3Icon3,
-  html .h5 .pagesBox .page3 .page3Icon3 {
-    width: 4.32rem;
-    height: 3.09333rem;
-    position: absolute;
-    right: 0rem;
-    top: 10rem;
-  }
-  body .h5 .pagesBox .page3 .page3Icon4,
-  html .h5 .pagesBox .page3 .page3Icon4 {
-    width: 3.78667rem;
-    height: 2.72rem;
-    position: absolute;
-    left: 0rem;
-    top: 11.14667rem;
  }
  body .h5 .pagesBox .page3 .downioad,
  html .h5 .pagesBox .page3 .downioad {
-    width: 5.52rem;
-    height: 1.12rem;
+    width: 4.44rem;
+    height: 1.06667rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.66667rem;
-    display: block;
-  }
-  body .h5 .pagesBox .page3 .down,
-  html .h5 .pagesBox .page3 .down {
-    width: 0.50667rem;
-    height: 0.37333rem;
-    position: absolute;
-    left: 48%;
-    bottom: 0.26667rem;
  }
  body .h5 .pagesBox .page4,
  html .h5 .pagesBox .page4 {
@@ -405,61 +560,37 @@
    height: 100%;
    position: relative;
    overflow: hidden;
-    background: url(../images/h51.png) no-repeat center;
+    background: url(../images/h54.png) no-repeat center;
    background-size: 10rem 100%;
  }
-  body .h5 .pagesBox .page4 .pageText4,
-  html .h5 .pagesBox .page4 .pageText4 {
-    width: 6.4rem;
-    height: 1.52rem;
-    position: relative;
-    top: 2.8rem;
-    display: block;
-    margin: 0 auto;
-    display: none;
-  }
-  body .h5 .pagesBox .page4 .page4_in,
-  html .h5 .pagesBox .page4 .page4_in {
-    width: 10rem;
-    height: 11.65333rem;
+  body .h5 .pagesBox .page4 .title,
+  html .h5 .pagesBox .page4 .title {
+    width: 100%;
+    height: 1.12rem;
+    text-align: center;
+    color: #fff;
+    font-weight: 600;
+    font-size: 0.8rem;
    position: absolute;
+    top: 3.06667rem;
+    left: 0;
+  }
+  body .h5 .pagesBox .page4 .img,
+  html .h5 .pagesBox .page4 .img {
+    position: absolute;
+    width: 10rem;
+    top: 4.77333rem;
    left: 50%;
    transform: translateX(-50%);
-    top: 2.50667rem;
-  }
-  body .h5 .pagesBox .page4 .page4Icon1,
-  html .h5 .pagesBox .page4 .page4Icon1 {
-    width: 5.57333rem;
-    height: 5.12rem;
-    position: absolute;
-    left: 0rem;
-    top: 5.12rem;
-  }
-  body .h5 .pagesBox .page4 .page4Icon2,
-  html .h5 .pagesBox .page4 .page4Icon2 {
-    width: 5.57333rem;
-    height: 5.12rem;
-    position: absolute;
-    right: 0rem;
-    top: 8.58667rem;
  }
  body .h5 .pagesBox .page4 .downioad,
  html .h5 .pagesBox .page4 .downioad {
-    width: 5.52rem;
-    height: 1.12rem;
+    width: 4.44rem;
+    height: 1.06667rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.66667rem;
-    display: block;
-  }
-  body .h5 .pagesBox .page4 .down,
-  html .h5 .pagesBox .page4 .down {
-    width: 0.50667rem;
-    height: 0.37333rem;
-    position: absolute;
-    left: 48%;
-    bottom: 0.26667rem;
  }
  body .h5 .pagesBox .page5,
  html .h5 .pagesBox .page5 {
@@ -582,7 +713,7 @@
    height: 0.74667rem;
    line-height: 0.74667rem;
    box-sizing: border-box;
-    border: 1px solid #fff;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
    vertical-align: middle;
    color: #fff;
    font-size: 0.32rem;
@@ -728,7 +859,7 @@

 .language_pub .language_pub_in {
  width: 7.8rem;
-  height: 6.4rem;
+  height: 7.2rem;
  left: 50%;
  top: 50%;
  position: absolute;
--- a/view/molistar/home/css/index.scss
+++ b/view/molistar/home/css/index.scss
@@ -20,272 +20,242 @@
    html {
        width: 100%;
        height: 100%;
-        // background: linear-gradient(180deg, #8C80F3 0%, #D070F2 100%);
-        background: linear-gradient(180deg, #61C9A0 0%, #309470 100%);
        font-family: Avenir, Avenir;
        cursor: pointer;

-        // .pc {
-        //     width: 100%;
-        //     height: 100%;
-        //     // background: url(../images/pcBg.png) no-repeat center;
-        //     // background-size: px2rem(1920) px2rem(1080);
-        //     position: relative;
-        //     // display: block;
-        //     display: none;
-
-        //     .header {
-        //         width: 1400px;
-        //         height: 108px;
-        //         position: absolute;
-        //         left: 50%;
-        //         top: 0;
-        //         transform: translateX(-50%);
-
-        //         .logo {
-        //             width: px2rem(54);
-        //             height: px2rem(54);
-        //             position: absolute;
-        //             top: px2rem(27);
-        //             // left: px2rem(360);
-        //             left: 3.8rem;
-        //         }
-
-        //         .name {
-        //             height: 100%;
-        //             line-height: px2rem(108);
-        //             font-size: px2rem(40);
-        //             color: #FFFFFF;
-        //             font-weight: 800;
-        //             position: absolute;
-        //             top: 0;
-        //             // left: px2rem(430);
-        //             left: 4.73333rem;
-        //         }
-
-        //         .index {
-        //             height: 100%;
-        //             line-height: px2rem(108);
-        //             font-family: PingFangSC, PingFang SC;
-        //             font-weight: 500;
-        //             position: absolute;
-        //             top: 0;
-        //             left: 7.76rem;
-        //             font-size: px2rem(28);
-        //             color: #fff;
-
-        //             span {
-        //                 width: px2rem(28);
-        //                 height: px2rem(6);
-        //                 background: #9168FA;
-        //                 border-radius: px2rem(6);
-        //                 position: absolute;
-        //                 left: 50%;
-        //                 transform: translateX(-50%);
-        //                 top: px2rem(76);
-        //             }
-        //         }
-
-        //         .diamound {
-        //             width: px2rem(118);
-        //             height: px2rem(48);
-        //             line-height: px2rem(48);
-        //             color: #FFFFFF;
-        //             font-size: px2rem(24);
-        //             text-align: center;
-        //             background: rgba(255, 255, 255, 0.2);
-        //             border-radius: px2rem(48);
-        //             box-sizing: border-box;
-        //             border: 1px solid #fff;
-        //             position: absolute;
-        //             right: 3.06667rem;
-        //             top: px2rem(30);
-        //             vertical-align: middle;
-
-        //             img {
-        //                 display: inline-block;
-        //                 width: px2rem(30);
-        //                 height: px2rem(30);
-        //                 vertical-align: middle;
-        //             }
-        //         }
-        //     }
-
-        //     .Box {
-        //         position: relative;
-        //         // width: px2rem(2720);
-        //         width: 28.08rem;
-        //         height: px2rem(1506);
-        //         overflow: hidden;
-        //         top: px2rem(140);
-        //         left: 50%;
-        //         transform: translateX(-50%);
-        //     }
-
-        //     .pcMarket1 {
-        //         width: px2rem(1542/2);
-        //         height: px2rem(1506/2);
-        //         position: absolute;
-        //         left: px2rem(0);
-        //         top: px2rem(0);
-        //     }
-
-        //     .pcText {
-        //         width: px2rem(1060/2);
-        //         height: px2rem(320/2);
-        //         position: absolute;
-        //         // left: px2rem(1092);
-        //         right: px2rem(0);
-        //         top: px2rem(400/2);
-        //     }
-
-        //     .pcIos {
-        //         width: px2rem(284);
-        //         height: px2rem(64);
-        //         position: absolute;
-        //         // left: px2rem(1091);
-        //         right: px2rem(484/2);
-        //         top: px2rem(816/2);
-        //     }
-
-        //     .pcAnd {
-        //         width: px2rem(284);
-        //         height: px2rem(64);
-        //         position: absolute;
-        //         // left: px2rem(1091);
-        //         right: px2rem(484/2);
-        //         top: px2rem(1000/2);
-        //     }
-
-        //     .code {
-        //         width: px2rem(160);
-        //         height: px2rem(166);
-        //         position: absolute;
-        //         // left: px2rem(1373);
-        //         right: px2rem(100/2);
-        //         top: px2rem(806/2);
-        //     }
-
-        //     .bottom {
-        //         text-align: center;
-        //         color: #B7B6BE;
-        //         font-size: px2rem(16);
-        //         width: 100%;
-        //         padding: px2rem(29) 0;
-        //         position: fixed;
-        //         left: 0;
-        //         bottom: 0;
-        //         background: #0E0B24;
-        //         min-height: 1rem;
-
-        //         p {
-        //             margin-bottom: px2rem(16);
-        //         }
-        //     }
-        // }
-
        .container {
-            position: relative;
-        }
-
-        .pc-bg {
-            display: none;
-        }
-
-        .homePc {
            width: 100%;
-            height: 10rem;
-            background: url(../images/pcBgBig.png) no-repeat;
-            background-size: 100% 100%;
+            height: 100vh;
            position: relative;
+            overflow-y: hidden;

-            .diamound {
-                // width: 1.2rem;
-                padding: 0 px2rem(20);
-                height: 0.5rem;
-                line-height: px2rem(35);
-                color: #FFFFFF;
-                font-size: 0.25rem;
-                text-align: center;
-                background: rgba(255, 255, 255, 0.2);
-                border-radius: px2rem(40);
-                box-sizing: border-box;
-                border: 1px solid #fff;
-                position: absolute;
-                right: px2rem(260);
-                top: 0.3rem;
-                vertical-align: middle;
+            .pagesBox {
+                width: 100%;
+                height: 100vh;
+                // overflow: hidden;
+                transition: all .5s;
+                transform: translateY(-0%);

-                img {
-                    display: inline-block;
-                    width: px2rem(38);
-                    height: px2rem(38);
-                    vertical-align: middle;
-                    margin-top: -0.01rem;
+                .page1 {
+                    width: 100%;
+                    height: 100%;
+                    background: url(../images/pc1.png) no-repeat center center;
+                    background-size: cover;
+                    position: relative;
+
+                    .logoPc {
+                        width: px2rem(202);
+                        height: px2rem(70);
+                        position: absolute;
+                        left: px2rem(64);
+                        top: px2rem(28);
+                    }
+
+                    .tab {
+                        width: px2rem(320);
+                        height: px2rem(31);
+                        line-height: px2rem(31);
+                        display: flex;
+                        justify-content: space-between;
+                        color: #fff;
+                        font-size: px2rem(22);
+                        font-weight: 500;
+                        position: absolute;
+                        left: 50%;
+                        transform: translateX(-50%);
+                        top: px2rem(45);
+
+                        p {
+                            position: relative;
+
+                            span {
+                                width: px2rem(35);
+                                height: px2rem(7);
+                                border-radius: px2rem(7);
+                                position: absolute;
+                                left: 50%;
+                                transform: translateX(-50%);
+                                bottom: px2rem(-20);
+                                background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+                            }
+                        }
+
+                        .tex {
+                            opacity: 0.5;
+                        }
+                    }
+
+                    .recharge {
+                        width: px2rem(122);
+                        height: px2rem(36);
+                        line-height: px2rem(32);
+                        background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+                        text-align: center;
+                        color: #fff;
+                        font-size: px2rem(16);
+                        border-radius: px2rem(36);
+                        position: absolute;
+                        top: px2rem(45);
+                        right: px2rem(183);
+
+                        img {
+                            width: px2rem(22);
+                            height: px2rem(22);
+                            display: inline-block;
+                            vertical-align: middle;
+                            margin-right: px2rem(2);
+                        }
+
+                        span {
+                            vertical-align: middle;
+                        }
+                    }
+
+                    .language {
+                        position: absolute;
+                        right: px2rem(64);
+                        top: px2rem(45);
+                        width: px2rem(99);
+                        height: px2rem(36);
+                        border-radius: px2rem(36);
+                        line-height: px2rem(36);
+                        background: rgba(255, 255, 255, .2);
+                        color: #fff;
+                        text-align: center;
+                        font-size: px2rem(16);
+                        font-weight: 400;
+                    }
+
+                    .title {
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(60);
+                        color: #fff;
+                        font-weight: 600;
+                        position: absolute;
+                        left: 0;
+                        top: px2rem(395);
+                    }
+
+                    h3 {
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(44);
+                        color: #fff;
+                        font-weight: 400;
+                        position: absolute;
+                        left: 0;
+                        top: px2rem(500);
+                    }
+
+                    .h5Ios {
+                        width: px2rem(333);
+                        height: px2rem(80);
+                        position: absolute;
+                        left: px2rem(550);
+                        top: px2rem(634);
+                    }
+
+                    .h5And {
+                        width: px2rem(333);
+                        height: px2rem(80);
+                        position: absolute;
+                        right: px2rem(550);
+                        top: px2rem(634);
+                    }
+
+                    .team {
+                        width: 100%;
+                        text-align: center;
+                        color: #fff;
+                        opacity: 0.6;
+                        font-size: px2rem(16);
+                        font-weight: 400;
+                        position: absolute;
+                        left: 0;
+                        bottom: px2rem(30);
+                    }
                }
-            }

-            .language {
-                color: #fff;
-                position: absolute;
-                height: 0.5rem;
-                line-height: 0.5rem;
-                right: 1rem;
-                top: .3rem;
-                font-size: px2rem(19);
-                font-weight: bold;
-            }
+                .page2 {
+                    width: 100%;
+                    height: 100%;
+                    background: url(../images/pc2.png) no-repeat center center;
+                    background-size: cover;
+                    position: relative;

-            .privacy {
-                color: #fff;
-                position: absolute;
-                height: 0.5rem;
-                line-height: 0.5rem;
-                left: 6.4rem;
-                top: .3rem;
-                width: 3rem;
-            }
+                    .title {
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(60);
+                        color: #fff;
+                        font-weight: 600;
+                        position: absolute;
+                        left: 0;
+                        top: px2rem(65);
+                    }

-            .pcIos {
-                width: 2.9rem;
-                height: 0.64rem;
-                position: absolute;
-                right: 5rem;
-                top: 5.855rem;
-                // background: url(../images/pcIos.png) no-repeat;
-                // background-size: 100% 100%;
-            }
+                    img {
+                        position: absolute;
+                        width: px2rem(1200);
+                        top: px2rem(200);
+                        left: 50%;
+                        transform: translateX(-50%);
+                    }
+                }

-            .pcAnd {
-                width: 2.9rem;
-                height: 0.64rem;
-                position: absolute;
-                right: 5rem;
-                top: 6.79rem;
-                // background: url(../images/pcAnd.png) no-repeat;
-                // background-size: 100% 100%;
-            }
-        }
+                .page3 {
+                    width: 100%;
+                    height: 100%;
+                    background: url(../images/pc3.png) no-repeat center center;
+                    background-size: cover;
+                    position: relative;

-        .bootom {
-            width: 100%;
-            position: fixed;
-            left: 0;
-            bottom: 0;
-            background: #0F0B27;
-            text-align: center;
-            color: #fff;
-            padding-bottom: 0.2rem;
-            padding-top: 0.1rem;
+                    .title {
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(60);
+                        color: #fff;
+                        font-weight: 600;
+                        position: absolute;
+                        left: 0;
+                        top: px2rem(65);
+                    }

-            p {
-                margin-top: 0.1rem;
-                // margin-bottom: 0.1rem;
-                font-size: 0.15rem;
-                color: #fff;
+                    img {
+                        position: absolute;
+                        width: px2rem(1200);
+                        top: px2rem(200);
+                        left: 50%;
+                        transform: translateX(-50%);
+                    }
+                }

-                a {
-                    color: #fff;
+                .page4 {
+                    width: 100%;
+                    height: 100%;
+                    background: url(../images/pc4.png) no-repeat center center;
+                    background-size: cover;
+                    position: relative;
+
+                    .title {
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(60);
+                        color: #fff;
+                        font-weight: 600;
+                        position: absolute;
+                        left: 0;
+                        top: px2rem(65);
+                    }
+
+                    img {
+                        position: absolute;
+                        width: px2rem(1200);
+                        top: px2rem(200);
+                        left: 50%;
+                        transform: translateX(-50%);
+                    }
                }
            }
        }
@@ -314,7 +284,7 @@
            width: 100%;
            height: px2rem(90);
            box-sizing: border-box;
-            padding: 0 px2rem(40);
+            padding: 0 px2rem(32);
            margin: px2rem(20) auto 0;
            z-index: 3;

@@ -328,6 +298,7 @@
                left: 50%;
                transform: translateX(-50%);
                bottom: 0;
+                display: none;
            }

            .logo {
@@ -349,18 +320,18 @@
            .diamound {
                // width: px2rem(140);
                padding: 0 px2rem(20);
-                height: px2rem(56);
-                line-height: px2rem(56);
+                height: px2rem(60);
+                line-height: px2rem(60);
                box-sizing: border-box;
-                border: 1px solid #fff;
+                background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
                vertical-align: middle;
                color: #fff;
                font-size: px2rem(24);
                float: right;
                margin-top: px2rem(4);
-                margin-right: px2rem(32);
+                margin-right: px2rem(18);
                text-align: center;
-                border-radius: px2rem(56);
+                border-radius: px2rem(60);

                img {
                    vertical-align: middle;
@@ -377,15 +348,24 @@
                height: px2rem(40);
                display: block;
                margin-top: px2rem(12);
+                display: none;
            }

            .language {
                float: right;
-                color: #fff;
-                height: px2rem(40);
-                line-height: px2rem(40);
-                margin-top: px2rem(12);
+                width: px2rem(164);
+                height: px2rem(60);
+                border-radius: px2rem(60);
+                line-height: px2rem(60);
+                margin-top: px2rem(4);
                margin-right: px2rem(20);
+                background: rgba(255, 255, 255, .2);
+                color: #fff;
+                text-align: center;
+
+                b {
+                    font-size: px2rem(24);
+                }
            }
        }

@@ -411,6 +391,80 @@
                    background: url(../images/h51.png) no-repeat center;
                    background-size: px2rem(750) 100%;

+                    .tab {
+                        width: 70%;
+                        display: flex;
+                        position: absolute;
+                        top: px2rem(160);
+                        height: px2rem(44);
+                        line-height: px2rem(44);
+                        left: 50%;
+                        transform: translateX(-50%);
+                        justify-content: space-evenly;
+
+                        p {
+                            color: #FFFFFF;
+                            opacity: 0.2;
+                            position: relative;
+                            font-size: px2rem(32);
+                            white-space: nowrap;
+
+                            span {
+                                width: px2rem(44);
+                                height: px2rem(10);
+                                border-radius: px2rem(10);
+                                background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+                                position: absolute;
+                                left: 50%;
+                                transform: translateX(-50%);
+                                bottom: px2rem(-20);
+                                font-size: px2rem(32);
+                                font-weight: 500;
+                            }
+                        }
+
+                        .act {
+                            opacity: 1;
+                        }
+                    }
+
+                    .title {
+                        width: 100%;
+                        height: px2rem(84);
+                        text-align: center;
+                        color: #fff;
+                        font-weight: 600;
+                        font-size: px2rem(60);
+                        position: absolute;
+                        top: px2rem(584);
+                        left: 0;
+                    }
+
+                    .tex {
+                        width: px2rem(686);
+                        height: px2rem(112);
+                        line-height: px2rem(56);
+                        position: absolute;
+                        top: px2rem(694);
+                        left: 50%;
+                        transform: translateX(-50%);
+                        color: #fff;
+                        text-align: center;
+                        opacity: 0.6;
+                        font-size: px2rem(40);
+                        font-weight: 400;
+                    }
+
+                    .team {
+                        width: 100%;
+                        left: 0;
+                        bottom: px2rem(82);
+                        text-align: center;
+                        color: #fff;
+                        opacity: 0.8;
+                        position: absolute;
+                    }
+
                    .pageTxte1 {
                        width: px2rem(482);
                        height: px2rem(100);
@@ -428,8 +482,8 @@
                    }

                    .downioad {
-                        width: px2rem(414);
-                        height: px2rem(92);
+                        width: px2rem(333);
+                        height: px2rem(80);
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
@@ -453,65 +507,37 @@
                    height: 100%;
                    position: relative;
                    overflow: hidden;
-                    background: url(../images/h51.png) no-repeat center;
+                    background: url(../images/h52.png) no-repeat center;
                    background-size: px2rem(750) 100%;
-                    // display: none;

-                    .pageText2 {
-                        width: px2rem(750);
-                        height: px2rem(814);
-                        position: relative;
-                        top: px2rem(258);
-                        margin: 0 auto;
-                        display: block;
-                        display: none;
+                    // display: none;
+                    .title {
+                        width: 100%;
+                        height: px2rem(84);
+                        text-align: center;
+                        color: #fff;
+                        font-weight: 600;
+                        font-size: px2rem(60);
+                        position: absolute;
+                        top: px2rem(230);
+                        left: 0;
                    }

-                    .page2_in {
-                        width: px2rem(750);
-                        height: px2rem(874);
+                    .img {
                        position: absolute;
+                        width: px2rem(750);
+                        top: px2rem(358);
                        left: 50%;
                        transform: translateX(-50%);
-                        // bottom: px2rem(194);
-                        top: px2rem(188);
-                    }
-
-                    .pagetx1 {
-                        width: px2rem(476);
-                        height: px2rem(308);
-                        position: absolute;
-                        left: px2rem(234);
-                        top: px2rem(342);
-                        // bottom: px2rem(620);
-                    }
-
-                    .pagetx2 {
-                        width: px2rem(476);
-                        height: px2rem(308);
-                        position: absolute;
-                        left: px2rem(40);
-                        top: px2rem(688);
-                        // bottom: px2rem(300);
                    }

                    .downioad {
-                        width: px2rem(414);
-                        height: px2rem(84);
+                        width: px2rem(333);
+                        height: px2rem(80);
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
                        bottom: px2rem(125);
-                        display: block;
-                    }
-
-                    .down {
-                        width: px2rem(38);
-                        height: px2rem(28);
-                        position: absolute;
-                        left: 48%;
-                        // transform: translateX(-50%);
-                        bottom: px2rem(20);
                    }
                }

@@ -520,86 +546,37 @@
                    height: 100%;
                    position: relative;
                    overflow: hidden;
-                    background: url(../images/h51.png) no-repeat center;
+                    background: url(../images/h53.png) no-repeat center;
                    background-size: px2rem(750) 100%;
-                    // display: none;

-                    .pageText3 {
-                        width: px2rem(512);
-                        height: px2rem(114);
-                        position: relative;
-                        // left: 50%;
-                        // transform: translateX(-50%);
-                        display: block;
-                        margin: 0 auto;
-                        top: px2rem(210);
-                        display: none;
+                    // display: none;
+                    .title {
+                        width: 100%;
+                        height: px2rem(84);
+                        text-align: center;
+                        color: #fff;
+                        font-weight: 600;
+                        font-size: px2rem(60);
+                        position: absolute;
+                        top: px2rem(230);
+                        left: 0;
                    }

-                    .page3_in {
-                        width: px2rem(750);
-                        height: px2rem(874);
+                    .img {
                        position: absolute;
+                        width: px2rem(750);
+                        top: px2rem(358);
                        left: 50%;
                        transform: translateX(-50%);
-                        top: px2rem(188);
-                        // bottom: px2rem(194);
-                    }
-
-                    .page3Icon1 {
-                        width: px2rem(307);
-                        height: px2rem(220);
-                        position: absolute;
-                        left: px2rem(426);
-                        top: px2rem(424);
-                        // bottom: px2rem(648);
-                    }
-
-                    .page3Icon2 {
-                        width: px2rem(324);
-                        height: px2rem(232);
-                        position: absolute;
-                        left: px2rem(0);
-                        top: px2rem(364);
-                        // bottom: px2rem(738);
-                    }
-
-                    .page3Icon3 {
-                        width: px2rem(324);
-                        height: px2rem(232);
-                        position: absolute;
-                        // left: px2rem(440);
-                        right: px2rem(0);
-                        top: px2rem(750);
-                        // bottom: px2rem(376);
-                    }
-
-                    .page3Icon4 {
-                        width: px2rem(284);
-                        height: px2rem(204);
-                        position: absolute;
-                        left: px2rem(0);
-                        top: px2rem(836);
-                        // bottom: px2rem(284);
                    }

                    .downioad {
-                        width: px2rem(414);
-                        height: px2rem(84);
+                        width: px2rem(333);
+                        height: px2rem(80);
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
                        bottom: px2rem(125);
-                        display: block;
-                    }
-
-                    .down {
-                        width: px2rem(38);
-                        height: px2rem(28);
-                        position: absolute;
-                        left: 48%;
-                        // transform: translateX(-50%);
-                        bottom: px2rem(20);
                    }
                }

@@ -608,65 +585,37 @@
                    height: 100%;
                    position: relative;
                    overflow: hidden;
-                    background: url(../images/h51.png) no-repeat center;
+                    background: url(../images/h54.png) no-repeat center;
                    background-size: px2rem(750) 100%;
                    // display: none;

-                    .pageText4 {
-                        width: px2rem(480);
-                        height: px2rem(114);
-                        position: relative;
-                        top: px2rem(210);
-                        display: block;
-                        margin: 0 auto;
-                        display: none;
+                    .title {
+                        width: 100%;
+                        height: px2rem(84);
+                        text-align: center;
+                        color: #fff;
+                        font-weight: 600;
+                        font-size: px2rem(60);
+                        position: absolute;
+                        top: px2rem(230);
+                        left: 0;
                    }

-                    .page4_in {
-                        width: px2rem(750);
-                        height: px2rem(874);
+                    .img {
                        position: absolute;
+                        width: px2rem(750);
+                        top: px2rem(358);
                        left: 50%;
                        transform: translateX(-50%);
-                        top: px2rem(188);
-                        // bottom: px2rem(194);
-                    }
-
-                    .page4Icon1 {
-                        width: px2rem(418);
-                        height: px2rem(384);
-                        position: absolute;
-                        left: px2rem(0);
-                        top: px2rem(384);
-                        // bottom: px2rem(224);
-                    }
-
-                    .page4Icon2 {
-                        width: px2rem(418);
-                        height: px2rem(384);
-                        position: absolute;
-                        right: px2rem(0);
-                        top: px2rem(644);
-                        // bottom: px2rem(224);
                    }

                    .downioad {
-                        width: px2rem(414);
-                        height: px2rem(84);
+                        width: px2rem(333);
+                        height: px2rem(80);
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
                        bottom: px2rem(125);
-                        display: block;
-                    }
-
-                    .down {
-                        width: px2rem(38);
-                        height: px2rem(28);
-                        position: absolute;
-                        left: 48%;
-                        // transform: translateX(-50%);
-                        bottom: px2rem(20);
                    }
                }

@@ -800,7 +749,8 @@
                        height: px2rem(56);
                        line-height: px2rem(56);
                        box-sizing: border-box;
-                        border: 1px solid #fff;
+                        // border: 1px solid #fff;
+                        background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
                        vertical-align: middle;
                        color: #fff;
                        font-size: px2rem(24);
@@ -952,7 +902,7 @@

    .language_pub_in {
        width: 7.8rem;
-        height: px2rem(480);
+        height: px2rem(540);
        left: 50%;
        top: 50%;
        position: absolute;
@@ -994,5 +944,4 @@
            }
        }
    }
-}
-
+}
--- a/view/molistar/home/images/diamond.png
+++ b/view/molistar/home/images/diamond.png
--- a/view/molistar/home/images/h2img.png
+++ b/view/molistar/home/images/h2img.png
--- a/view/molistar/home/images/h3img.png
+++ b/view/molistar/home/images/h3img.png
--- a/view/molistar/home/images/h4img.png
+++ b/view/molistar/home/images/h4img.png
--- a/view/molistar/home/images/h51.png
+++ b/view/molistar/home/images/h51.png
--- a/view/molistar/home/images/h52.png
+++ b/view/molistar/home/images/h52.png
--- a/view/molistar/home/images/h53.png
+++ b/view/molistar/home/images/h53.png
--- a/view/molistar/home/images/h54.png
+++ b/view/molistar/home/images/h54.png
--- a/view/molistar/home/images/h5And.png
+++ b/view/molistar/home/images/h5And.png
--- a/view/molistar/home/images/h5Ios.png
+++ b/view/molistar/home/images/h5Ios.png
--- a/view/molistar/home/images/logoPc.png
+++ b/view/molistar/home/images/logoPc.png
--- a/view/molistar/home/images/pc1.png
+++ b/view/molistar/home/images/pc1.png
--- a/view/molistar/home/images/pc2.png
+++ b/view/molistar/home/images/pc2.png
--- a/view/molistar/home/images/pc2img.png
+++ b/view/molistar/home/images/pc2img.png
--- a/view/molistar/home/images/pc3.png
+++ b/view/molistar/home/images/pc3.png
--- a/view/molistar/home/images/pc3img.png
+++ b/view/molistar/home/images/pc3img.png
--- a/view/molistar/home/images/pc4.png
+++ b/view/molistar/home/images/pc4.png
--- a/view/molistar/home/images/pc4img.png
+++ b/view/molistar/home/images/pc4img.png
--- a/view/molistar/home/index.html
+++ b/view/molistar/home/index.html
@@ -16,28 +16,14 @@
    <meta property="og:image:type" content="image/png">
    <link rel="stylesheet" href="../common/css/reset.css">
    <link rel="stylesheet" href="./css/animate.css">
-    <link rel="stylesheet" href="./css/index.css?v=1.2">
+    <link rel="stylesheet" href="./css/index.css?v=1.22">
 </head>

 <body>
    <!-- pc端 -->
    <div class="container pc">
-        <div class="pc-bg">
-            <!-- <img src="./images/homePc.png" alt=""> -->
-            <div class="homePc">
-                <div class="diamound">
-                    <img src="./images/diamond.png" alt=""> <b class="text3"></b>
-                </div>
-                <!-- 隐私政策 -->
-                <a class="privacy" href="../modules/rule/privacy-wap.html"></a>
-                <!-- 语言 -->
-                <div class="language"><b></b> ▼</div>
-                <div class="pcIos"></div>
-                <div class="pcAnd"></div>
-            </div>
-            <div class="bootom">
-                <p>Molistar Team</p>
-            </div>
+        <div class="pagesBox pcText">
+            
        </div>
    </div>
    <!-- h5端 -->
@@ -50,41 +36,28 @@
            <div class="name">MoliStar</div>
            <!-- 更多 -->
            <img src="./images/more.png" alt="" class="more">
+            <!-- 语言 -->
+            <div class="language"><b></b> ▼</div>
            <!-- 儲值 -->
            <div class="diamound">
                <img src="./images/diamond.png" alt=""> <b class="text3"></b>
            </div>
-            <!-- 语言 -->
-            <div class="language"><b></b> ▼</div>
            <!-- 線 -->
            <div class="line"></div>

        </div>
        <div class="pagesBox">
            <!-- 頁面1 -->
-            <div class="pages page1 animate__animated" id="img2">
-
-            </div>
+            <div class="pages page1" id="img2"></div>

            <!-- 頁面2 -->
-            <div class="pages page2" id="img3">
-
-            </div>
+            <div class="pages page2" id="img3"></div>

            <!-- 頁面3 -->
-            <div class="pages page3" id="img4">
-
-            </div>
+            <div class="pages page3" id="img4"></div>

            <!-- 頁面4 -->
-            <div class="pages page4" id="img5">
-
-            </div>
-
-            <!-- 頁面5 -->
-            <div class="pages page5" id="img6">
-
-            </div>
+            <div class="pages page4" id="img5"></div>
        </div>

        <!-- 菜單 -->
@@ -155,6 +128,7 @@
                <li data="zh">中文</li>
                <li data="en">English</li>
                <li data="ar">العربية</li>
+                <li data="tr">Türkiye</li>
            </ul>
        </div>
    </div>
@@ -167,7 +141,8 @@
    <script src="./local/ar.js?v=1.0"></script>
    <script src="./local/en.js?v=1.0"></script>
    <script src="./local/zh.js?v=1.0"></script>
-    <script src="./js/index.js?v=2.123"></script>
+    <script src="./local/tr.js?v=1.0"></script>
+    <script src="./js/index.js?v=2.1231"></script>
    <script src="../common/local/langHandler.js"></script>
 </body>

--- a/view/molistar/home/js/index.js
+++ b/view/molistar/home/js/index.js
@@ -40,16 +40,15 @@ $(function () {
    $(document).ready(function () {
        var deviceWidth = document.documentElement.clientWidth;
        if (deviceWidth > 768) {
-            document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+            document.documentElement.style.fontSize = deviceWidth / 25 + 'px';
        } else {
            // document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
        }
    });
    window.onresize = function () {
        var deviceWidth = document.documentElement.clientWidth;
-        // console.log('deviceWidth', deviceWidth);
        if (deviceWidth > 768) {
-            document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+            document.documentElement.style.fontSize = deviceWidth / 25 + 'px';
        } else {
            // document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
        }
@@ -93,6 +92,9 @@ $(function () {
        } else if (langCode == 'ar') {
            $('.privacy').css('left', '7.4rem')
            $('.language').html('<b>العربية</b> ▼')
+        } else if (langCode == 'tr') {
+            $('.privacy').css('left', '7.4rem')
+            $('.language').html('<b>Türkiye</b> ▼')
        } else {
            $('.privacy').css('left', '7.4rem')
            $('.language').html('<b>English</b> ▼')
@@ -108,6 +110,9 @@ $(function () {
 })

 function translateFun() {
+    var langCode = getQueryString().lang ? getQueryString().lang : getLanguageCode(getUserLanguage());
+    langCode = getLanguageCode(langCode);
+    langCodes = langCode
    var langReplace = window.lang.replace;
    var localLang = window.lang;
    $('.text1').text(langReplace(localLang.demoModule.text1))
@@ -124,10 +129,61 @@ function translateFun() {
    $('#img4').html(langReplace(localLang.demoModule.img4))
    $('#img5').html(langReplace(localLang.demoModule.img5))
    $('#img6').html(langReplace(localLang.demoModule.img6))
+    $('.pcText').html(langReplace(localLang.demoModule.pcText))
+    // 选择语言
+    $('.language').click(function () {
+        $('.language_pub').show();
+    })
+    if (langCode == 'zh') {
+        $('.language').html('<b>中文</b> ▼')
+    } else if (langCode == 'ar') {
+        // $('.privacy').css('left', '7.4rem')
+        $('.language').html('<b>العربية</b> ▼')
+    } else if (langCode == 'tr') {
+        // $('.privacy').css('left', '7.4rem')
+        $('.language').html('<b>Türkiye</b> ▼')
+    } else {
+        // $('.privacy').css('left', '7.4rem')
+        $('.language').html('<b>English</b> ▼')
+    }
+    // 监听滚轮事件
+    var timeInterval = null;
+    var pcIndex = 0;
+    var pcTouchLength = 100;
+    var pcLength = $('body .container .pagesBox .pagesPc').length - 1;
+    window.addEventListener('wheel', function (event) {
+        // 清除上一次的定时器
+        clearTimeout(timeInterval);

+        // 设置新的定时器，延迟执行滚动处理
+        timeInterval = setTimeout(function () {
+            // 阻止默认的滚动行为（如果需要）
+            event.preventDefault();
+            // 检测滚动方向
+            if (event.deltaY > 0) {
+                // 向下滚动
+                console.log('向下滚动');
+                if (index > pcLength - 1) {
+                    return;
+                } else {
+                    index = index + 1;
+                    $('body .container .pagesBox').css("transform", `translateY(-${index * pcTouchLength}%)`);
+                    // animatedImplementFun(index);
+                }
+            } else {
+                // 向上滚动
+                console.log('向上滚动');
+                if (index > 0) {
+                    index = index - 1;
+                    $('body .container .pagesBox').css("transform", `translateY(-${index * pcTouchLength}%)`);
+                    // animatedImplementFun(index);
+                }
+            }
+        }, 100);  // 100ms 的延迟，可以根据需要调整
+    }, { passive: false });  // 禁止默认滚动行为
    // pc跳轉充值
-    $('body .pc .header .diamound, html .pc .header .diamound,body .homePc .diamound, html .homePc .diamound').click(function () {
-        window.location = `${urlPrefix}/molistar/modules/payPc/index.html?channelType=4&lang=${langCodes}`
+    $('body .container .pagesBox').on('click', '.page1 .recharge', function () {
+        window.location = `${urlPrefix}/molistar/modules/pay/index.html?channelType=4&lang=${langCodes}`
    })
    // PC蘋果下載按鈕
    $('html .pc .pcIos').click(function () {
@@ -178,6 +234,9 @@ function translateFun() {
            location.href = `../modules/rule/privacy-wap.html`
        }
    })
+    $('html .h5 .pagesBox .page1 .tab .privacy').click(function () {
+        location.href = `../modules/rule/privacy-wap.html`
+    })
    // 關閉聯繫我們彈窗
    $('body .contactUs_pub .contactUs_pub_in .sClose').click(function () {
        $('.contactUs_pub').hide();
@@ -249,7 +308,7 @@ function getConfig() {
                url = and;
                $('body .h5 .pagesBox .pages .downioad').attr('src', './images/h5And.png');
            }
-            $('body .h5 .pagesBox .page2 .downioad,body .h5 .pagesBox .page3 .downioad,body .h5 .pagesBox .page4 .downioad').attr('src', './images/downioad.png');
+            // $('body .h5 .pagesBox .page2 .downioad,body .h5 .pagesBox .page3 .downioad,body .h5 .pagesBox .page4 .downioad').attr('src', './images/downioad.png');
            $('.pc-bg').show();
            hideLoading(layerIndex)
            animatedImplementFun(0);
@@ -259,10 +318,13 @@ function getConfig() {
        }
    })
 }
-// 选择语言
-$('.language').click(function () {
-    $('.language_pub').show();
+$('body .container .pagesBox').on('click', '.page1 .h5Ios', function () {
+    window.location.href = ios;
 })
+$('body .container .pagesBox').on('click', '.page1 .h5And', function () {
+    window.location.href = and;
+})
+
 // 关闭语言
 $('.language_pub .language_pub_in .sClose').click(function () {
    $('.language_pub').hide();
@@ -302,7 +364,7 @@ $('body .h5').on('touchend', function (e) {
        } else {
            index = index + 1;
            $('.pagesBox').css("transform", `translateY(-${index * touchLength}%)`);
-            animatedImplementFun(index);
+            // animatedImplementFun(index);
        }
    }
    //下滑
@@ -310,7 +372,7 @@ $('body .h5').on('touchend', function (e) {
        if (index > 0) {
            index = index - 1;
            $('.pagesBox').css("transform", `translateY(-${index * touchLength}%)`);
-            animatedImplementFun(index);
+            // animatedImplementFun(index);
        }
    }
 })
@@ -350,14 +412,14 @@ function animatedImplementFun(index) {
 }
 // 處理動畫
 function animatedFun(dom, arrClass) {
-    // 獲取元素
-    const element = dom;
-    // 添加動畫
-    element.addClass(...arrClass);
-    // 監聽動畫結束
-    element[0].addEventListener('animationend', () => {
-        element.removeClass(...arrClass);
-    });
+    // // // 獲取元素
+    // const element = dom;
+    // // 添加動畫
+    // element.addClass(...arrClass);
+    // // 監聽動畫結束
+    // element[0].addEventListener('animationend', () => {
+    //     element.removeClass(...arrClass);
+    // });
 }

 // 禁止瀏覽器下拉刷新
@@ -369,6 +431,7 @@ function handleResize() {
    location.reload()
    // 这里可以添加更多的逻辑，比如检查窗口的新尺寸
 }
-
 // 监听窗口大小变化事件
-window.addEventListener('resize', handleResize);
+window.addEventListener('resize', handleResize);
+
+
--- a/view/molistar/home/local/ar.js
+++ b/view/molistar/home/local/ar.js
@@ -2,55 +2,74 @@
 langAr = {
    // 模块
    demoModule: {
-        text1: `MoliStar، اللقاء مع الصوت المؤثر بالقلب بشكل غير متوقع`,
-        text2: `الدردشة، واللعب، وتكوين الصداقات، في أي وقت وفي أي مكان على MoliStar`,
-        text3: `إعادة الشحن`,
+        text1: `MoliStar, لقاء مع الصوت المؤثر بشكل غير متوقع`,
+        text2: `الدردشة، اللعب، تكوين صداقات، في أي وقت، في أي مكان على MoliStar`,
+        text3: `إعادة شحن`,
        text4: `الصفحة الرئيسية`,
        text5: `المحفظة`,
        text6: `اتصل بنا`,
-        text7: `سياسة الخصوصية `,
-        textss: `الرجاء تحديد لغة.`,
+        text7: `سياسة الخصوصية`,
+        textss: `يرجى اختيار اللغة.`,
        homePc: `background:url(./images/pcBgBig-ar.png) no-repeat;background-size:100% 100%;`,
        img2: `
-        <img style="width: 7.42667rem;" src="./images/pageTxte1-ar.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
-        <img style="width: 7.42667rem;" src="./images/pageTxte2-ar.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
-        <!-- <img src="./images/h5And-ar.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
-        <img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
+        <div class="tab">
+            <p class="act">الصفحة الرئيسية<span></span></p>
+            <p class="privacy">سياسة الخصوصية</p>
+        </div>
+        <div class="title">انضم إلى MoliStar</div>
+        <div class="tex">استمع إلى الأصوات الجميلة وابحث عن رفقة جديدة</div>
+        <img src="./images/downioad.png" alt="" class="downioad  animate__animated ">
+        <div class="team">فريق Molistar</div>
    `,
        img3: `
-        <img src="./images/pageText2-ar.png" alt="" class="pageText2 animate__animated ">
-        <img src="./images/page2-ar.png" alt="" class="page2_in">
-        <img src="./images/pagetx1-ar.png" alt="" class="pagetx1  animate__animated ">
-        <img src="./images/pagetx2-ar.png" alt="" class="pagetx2  animate__animated ">
-        <img src="./images/downioad-ar.png" alt="" class="downioad  animate__animated ">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">انضم إلى MoliStar</div>
+        <img class="img" src="./images/h2img.png" alt="">`,
        img4: `
-        <img src="./images/pageText3-ar.png" alt="" class="pageText3 animate__animated">
-        <img src="./images/page3-ar.png" alt="" class="page3_in">
-        <img src="./images/page3Icon1-ar.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
-        <img src="./images/page3Icon2-ar.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
-        <img src="./images/page3Icon3-ar.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
-        <img src="./images/page3Icon4-ar.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
-        <img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">استمتع</div>
+        <img class="img" src="./images/h3img.png" alt="">`,
        img5: `
-        <img src="./images/pageText4-ar.png" alt="" class="pageText4 animate__animated">
-        <img src="./images/page4-ar.png" alt="" class="page4_in">
-        <img src="./images/page4Icon2-ar.png" alt="" class="page4Icon2 animate__animated">
-        <img src="./images/page4Icon1-ar.png" alt="" class="page4Icon1 animate__animated">
-        <img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">حفلة صوتية</div>
+        <img class="img" src="./images/h4img.png" alt="">`,
        img6: `
-        <img style="width: 6.61333rem;"  src="./images/pageTxte5-ar.png" alt="" class="pageTxte5 animate__animated">
-        <img style="width: 4.62667rem;" src="./images/contactUs-ar.png" alt="" class="contactUs animate__animated">
+        <img style="width: 6.61333rem;" src="./images/pageTxte5-ar.png" alt="" class="pageTxte5 animate__animated">
+        <img style="width: 4.2rem;" src="./images/contactUs-ar.png" alt="" class="contactUs animate__animated">
        <img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
-        <!-- <img src="./images/down.png" alt="" class="down"> -->
        <div class="bootom">
-            <p>Molistar Team</p>
-        </div>`,
+            <p>فريق Molistar</p>
+        </div>`, pcText: `
+        <div class="page1 pagesPc">
+                <img src="./images/logoPc.png" alt="" class="logoPc">
+                <div class="tab">
+                    <p class="act">الصفحة الرئيسية <span></span></p>
+                    <a href="../modules/rule/privacy-wap.html">
+                        <p class="tex">سياسة الخصوصية</p>
+                    </a>
+                </div>
+
+                <div class="recharge">
+                    <img src="./images/diamond.png" alt=""><span>إعادة شحن</span>
+                </div>
+                <!-- اللغة -->
+                <div class="language"><b></b> ▼</div>
+                <div class="title">انضم إلى MoliStar</div>
+                <h3>استمع إلى الأصوات الجميلة وابحث عن رفقة جديدة</h3>
+                <img src="./images/h5Ios.png" alt="" class="h5Ios">
+                <img src="./images/h5And.png" alt="" class="h5And">
+                <div class="team">Molistar Team</div>
+            </div>
+            <div class="page2 pagesPc">
+                <div class="title">روح مثيرة للاهتمام</div>
+                <img src="./images/pc2img.png" alt="">
+            </div>
+            <div class="page3 pagesPc">
+                <div class="title">استمتع</div>
+                <img src="./images/pc3img.png" alt="">
+            </div>
+            <div class="page4 pagesPc">
+                <div class="title">حفلة صوتية</div>
+                <img src="./images/pc4img.png" alt="">
+            </div>
+        `,
    }
-}
+}
+
--- a/view/molistar/home/local/en.js
+++ b/view/molistar/home/local/en.js
@@ -11,38 +11,24 @@ langEn = {
        textss: `Please select a language.`,
        homePc: `background:url(./images/pcBgBig-en.png) no-repeat;background-size:100% 100%;`,
        img2: `
-        <img style="width: 7.6rem;" src="./images/pageTxte1-en.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
-        <img style="width: 8.1rem;" src="./images/pageTxte2-en.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
-        <!-- <img src="./images/h5And-en.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
-        <img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
+        <div class="tab">
+            <p class="act">Homepage<span></span></p>
+            <p class="privacy">Privacy Policy</p>
+        </div>
+        <div class="title">Join MoliStar</div>
+        <div class="tex">Hear good voices and find new companionship</div>
+        <img src="./images/downioad.png" alt="" class="downioad  animate__animated ">
+        <div class="team">Molistar Team</div>
    `,
        img3: `
-        <img src="./images/pageText2-en.png" alt="" class="pageText2 animate__animated ">
-        <img src="./images/page2-en.png" alt="" class="page2_in">
-        <img src="./images/pagetx1-en.png" alt="" class="pagetx1  animate__animated ">
-        <img src="./images/pagetx2-en.png" alt="" class="pagetx2  animate__animated ">
-        <img src="./images/downioad-en.png" alt="" class="downioad  animate__animated ">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">Join MoliStar</div>
+        <img class="img" src="./images/h2img.png" alt="">`,
        img4: `
-        <img src="./images/pageText3-en.png" alt="" class="pageText3 animate__animated">
-        <img src="./images/page3-en.png" alt="" class="page3_in">
-        <img src="./images/page3Icon1-en.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
-        <img src="./images/page3Icon2-en.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
-        <img src="./images/page3Icon3-en.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
-        <img src="./images/page3Icon4-en.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
-        <img src="./images/downioad-en.png" alt="" class="downioad animate__animated">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">Have Fun</div>
+        <img class="img" src="./images/h3img.png" alt="">`,
        img5: `
-        <img src="./images/pageText4-en.png" alt="" class="pageText4 animate__animated">
-        <img src="./images/page4-en.png" alt="" class="page4_in">
-        <img src="./images/page4Icon2-en.png" alt="" class="page4Icon2 animate__animated">
-        <img src="./images/page4Icon1-en.png" alt="" class="page4Icon1 animate__animated">
-        <img src="./images/downioad-en.png" alt="" class="downioad animate__animated">
-        <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">
-    `,
+        <div class="title">Voice Party</div>
+        <img class="img" src="./images/h4img.png" alt="">`,
        img6: `
        <img style="width: 6.61333rem;" src="./images/pageTxte5-en.png" alt="" class="pageTxte5 animate__animated">
        <img style="width: 4.2rem;" src="./images/contactUs-en.png" alt="" class="contactUs animate__animated">
@@ -51,5 +37,39 @@ langEn = {
        <div class="bootom">
            <p>Molistar Team</p>
        </div>`,
+        pcText: `
+        <div class="page1 pagesPc">
+                <img src="./images/logoPc.png" alt="" class="logoPc">
+                <div class="tab">
+                    <p class="act">Homepage <span></span></p>
+                    <a href="../modules/rule/privacy-wap.html">
+                        <p class="tex">Privacy Policy</p>
+                    </a>
+                </div>
+
+                <div class="recharge">
+                    <img src="./images/diamond.png" alt=""><span>Recharge</span>
+                </div>
+                <!-- 语言 -->
+                <div class="language"><b></b> ▼</div>
+                <div class="title">Join MoliStar</div>
+                <h3>Hear good voices and find new companionship</h3>
+                <img src="./images/h5Ios.png" alt="" class="h5Ios">
+                <img src="./images/h5And.png" alt="" class="h5And">
+                <div class="team">Molistar Team</div>
+            </div>
+            <div class="page2 pagesPc">
+                <div class="title">Interesting Soul</div>
+                <img src="./images/pc2img.png" alt="">
+            </div>
+            <div class="page3 pagesPc">
+                <div class="title">Have Fun</div>
+                <img src="./images/pc3img.png" alt="">
+            </div>
+            <div class="page4 pagesPc">
+                <div class="title">Voice Party</div>
+                <img src="./images/pc4img.png" alt="">
+            </div>
+        `,
    }
 }
--- a/view/molistar/home/local/tr.js
+++ b/view/molistar/home/local/tr.js
@@ -0,0 +1,75 @@
+// 英文
+langTr = {
+    demoModule: {
+        text1: `MoliStar, kalp kırıcı sesle beklenmedik bir karşılaşma`,
+        text2: `Sohbet et, oyun oyna, arkadaşlar edin, MoliStar'da her zaman, her yerde`,
+        text3: `Yükle`,
+        text4: `Anasayfa`,
+        text5: `Cüzdan`,
+        text6: `Bize Ulaşın`,
+        text7: `Gizlilik Politikası`,
+        textss: `Lütfen bir dil seçin.`,
+        homePc: `background:url(./images/pcBgBig-tr.png) no-repeat;background-size:100% 100%;`,
+        img2: `
+        <div class="tab">
+            <p class="act">Anasayfa<span></span></p>
+            <p class="privacy">Gizlilik Politikası</p>
+        </div>
+        <div class="title">MoliStar'a Katıl</div>
+        <div class="tex">İyi sesler dinleyin ve yeni bir arkadaşlık bulun</div>
+        <img src="./images/downioad.png" alt="" class="downioad  animate__animated ">
+        <div class="team">Molistar Ekibi</div>
+    `,
+        img3: `
+        <div class="title">MoliStar'a Katıl</div>
+        <img class="img" src="./images/h2img.png" alt="">`,
+        img4: `
+        <div class="title">Eğlen</div>
+        <img class="img" src="./images/h3img.png" alt="">`,
+        img5: `
+        <div class="title">Sesli Parti</div>
+        <img class="img" src="./images/h4img.png" alt="">`,
+        img6: `
+        <img style="width: 6.61333rem;" src="./images/pageTxte5-tr.png" alt="" class="pageTxte5 animate__animated">
+        <img style="width: 4.2rem;" src="./images/contactUs-tr.png" alt="" class="contactUs animate__animated">
+        <img src="./images/downioad-tr.png" alt="" class="downioad animate__animated">
+        <div class="bootom">
+            <p>Molistar Ekibi</p>
+        </div>`,
+        pcText: `
+            <div class="page1 pagesPc">
+                    <img src="./images/logoPc.png" alt="" class="logoPc">
+                    <div class="tab">
+                        <p class="act">Anasayfa <span></span></p>
+                        <a href="../modules/rule/privacy-wap.html">
+                            <p class="tex">Gizlilik Politikası</p>
+                        </a>
+                    </div>
+    
+                    <div class="recharge">
+                        <img src="./images/diamond.png" alt=""><span>Yükle</span>
+                    </div>
+                    <!-- Dil -->
+                    <div class="language"><b></b> ▼</div>
+                    <div class="title">MoliStar'a Katıl</div>
+                    <h3>İyi sesler dinleyin ve yeni bir arkadaşlık bulun</h3>
+                    <img src="./images/h5Ios.png" alt="" class="h5Ios">
+                    <img src="./images/h5And.png" alt="" class="h5And">
+                    <div class="team">Molistar Team</div>
+                </div>
+                <div class="page2 pagesPc">
+                    <div class="title">İlginç Ruh</div>
+                    <img src="./images/pc2img.png" alt="">
+                </div>
+                <div class="page3 pagesPc">
+                    <div class="title">Eğlen</div>
+                    <img src="./images/pc3img.png" alt="">
+                </div>
+                <div class="page4 pagesPc">
+                    <div class="title">Sesli Parti</div>
+                    <img src="./images/pc4img.png" alt="">
+                </div>
+            `,
+    },
+
+}
--- a/view/molistar/home/local/zh.js
+++ b/view/molistar/home/local/zh.js
@@ -2,52 +2,75 @@
 langZh = {
    // 模块
    demoModule: {
-        text1: `MoliStar，與心動聲音不期而遇`,
-        text2: `聊天玩遊戲交朋友，隨時隨地在MoliStar`,
-        text3: `儲值`,
+        text1: `MoliStar，與觸動心靈的聲音意外相遇`,
+        text2: `聊天、玩遊戲、交朋友，在 MoliStar 隨時隨地`,
+        text3: `充值`,
        text4: `首頁`,
        text5: `錢包`,
        text6: `聯繫我們`,
-        text7: `隱私政策 `,
-        textss: `请选择语言`,
-        homePc: `background:url(./images/pcBgBig.png) no-repeat;background-size:100% 100%;`,
+        text7: `隱私政策`,
+        textss: `請選擇語言。`,
+        homePc: `background:url(./images/pcBgBig-zh.png) no-repeat;background-size:100% 100%;`,
        img2: `
-            <img src="./images/pageTxte1.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
-            <img src="./images/pageTxte2.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
-            <!-- <img src="./images/h5And.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
-            <img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
-            <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
-        `,
+        <div class="tab">
+            <p class="act">首頁<span></span></p>
+            <p class="privacy">隱私政策</p>
+        </div>
+        <div class="title">加入 MoliStar</div>
+        <div class="tex">聽到美好的聲音，並找到新的陪伴</div>
+        <img src="./images/downioad.png" alt="" class="downioad  animate__animated ">
+        <div class="team">Molistar 團隊</div>
+    `,
        img3: `
-            <img src="./images/pageText2.png" alt="" class="pageText2 animate__animated ">
-            <img src="./images/page2.png" alt="" class="page2_in">
-            <img src="./images/pagetx1.png" alt="" class="pagetx1  animate__animated ">
-            <img src="./images/pagetx2.png" alt="" class="pagetx2  animate__animated ">
-            <img src="./images/downioad.png" alt="" class="downioad  animate__animated ">
-            <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">`,
+        <div class="title">加入 MoliStar</div>
+        <img class="img" src="./images/h2img.png" alt="">`,
        img4: `
-            <img src="./images/pageText3.png" alt="" class="pageText3 animate__animated">
-            <img src="./images/page3.png" alt="" class="page3_in">
-            <img src="./images/page3Icon1.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
-            <img src="./images/page3Icon2.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
-            <img src="./images/page3Icon3.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
-            <img src="./images/page3Icon4.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
-            <img src="./images/downioad.png" alt="" class="downioad animate__animated">
-            <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">`,
+        <div class="title">盡情玩樂</div>
+        <img class="img" src="./images/h3img.png" alt="">`,
        img5: `
-            <img src="./images/pageText4.png" alt="" class="pageText4 animate__animated">
-            <img src="./images/page4.png" alt="" class="page4_in">
-            <img src="./images/page4Icon2.png" alt="" class="page4Icon2 animate__animated">
-            <img src="./images/page4Icon1.png" alt="" class="page4Icon1 animate__animated">
-            <img src="./images/downioad.png" alt="" class="downioad animate__animated">
-            <img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow  ">`,
+        <div class="title">語音派對</div>
+        <img class="img" src="./images/h4img.png" alt="">`,
        img6: `
-            <img src="./images/pageTxte5.png" alt="" class="pageTxte5 animate__animated">
-            <img src="./images/contactUs.png" alt="" class="contactUs animate__animated">
-            <img src="./images/downioad.png" alt="" class="downioad animate__animated">
-            <!-- <img src="./images/down.png" alt="" class="down"> -->
-            <div class="bootom">
-                <p>Molistar Team</p>
-            </div>`,
-    }
+        <img style="width: 6.61333rem;" src="./images/pageTxte5-zh.png" alt="" class="pageTxte5 animate__animated">
+        <img style="width: 4.2rem;" src="./images/contactUs-zh.png" alt="" class="contactUs animate__animated">
+        <img src="./images/downioad-zh.png" alt="" class="downioad animate__animated">
+        <div class="bootom">
+            <p>Molistar 團隊</p>
+        </div>`,
+        pcText: `
+            <div class="page1 pagesPc">
+                    <img src="./images/logoPc.png" alt="" class="logoPc">
+                    <div class="tab">
+                        <p class="act">首頁 <span></span></p>
+                        <a href="../modules/rule/privacy-wap.html">
+                            <p class="tex">隱私政策</p>
+                        </a>
+                    </div>
+    
+                    <div class="recharge">
+                        <img src="./images/diamond.png" alt=""><span>充值</span>
+                    </div>
+                    <!-- 語言 -->
+                    <div class="language"><b></b> ▼</div>
+                    <div class="title">加入 MoliStar</div>
+                    <h3>聽到美好的聲音，並找到新的陪伴</h3>
+                    <img src="./images/h5Ios.png" alt="" class="h5Ios">
+                    <img src="./images/h5And.png" alt="" class="h5And">
+                    <div class="team">Molistar Team</div>
+                </div>
+                <div class="page2 pagesPc">
+                    <div class="title">有趣的靈魂</div>
+                    <img src="./images/pc2img.png" alt="">
+                </div>
+                <div class="page3 pagesPc">
+                    <div class="title">盡情玩樂</div>
+                    <img src="./images/pc3img.png" alt="">
+                </div>
+                <div class="page4 pagesPc">
+                    <div class="title">語音派對</div>
+                    <img src="./images/pc4img.png" alt="">
+                </div>
+            `,
+    },
+
 }
--- a/view/molistar/modules/guild-ar/BANK.html
+++ b/view/molistar/modules/guild-ar/BANK.html
@@ -75,6 +75,7 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/BANK.js"></script>
 <script src="../../common/local/langHandler.js"></script>

--- a/view/molistar/modules/guild-ar/BANK_TRANSFER_LIRA.html
+++ b/view/molistar/modules/guild-ar/BANK_TRANSFER_LIRA.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="text1"></b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <input type="text" disabled placeholder="Currency Type:USD" class="text6">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <p class="p "><span>*</span> <b class="p1"></b></p>
+    <div class="box country">
+        <input type="text" readonly placeholder="Country" class="text7">
+        <img src="./images/right.png" alt="" class="right">
+    </div>
+    <p class="p "><span>*</span> <b class="p7"></b></p>
+    <div class="box payeeAccountNo">
+        <input type="text" placeholder="payeeAccountNo" class="text8">
+    </div>
+    <p class="p 5"><span>*</span> <b class="p5"></b></p>
+    <div class="box payeeName">
+        <input type="text" placeholder="payeeName" class="text9"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok text2"></div>
+        <!-- 解绑按钮 -->
+        <div class="determine text3"></div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title text4"></div>
+            <div class="soure text5"></div>
+            <div class="countryPub"></div>
+        </div>
+    </div>
+</body>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
+<script src="./js/bankTransferLira.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>
--- a/view/molistar/modules/guild-ar/CARD_USD.html
+++ b/view/molistar/modules/guild-ar/CARD_USD.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="text1"></b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <input type="text" disabled placeholder="Currency Type:USD" class="text6">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <p class="p "><span>*</span> <b class="p1"></b></p>
+    <div class="box country">
+        <input type="text" readonly placeholder="Country" class="text7">
+        <img src="./images/right.png" alt="" class="right">
+    </div>
+    <p class="p "><span>*</span> <b class="p7"></b></p>
+    <div class="box payeeAccountNo">
+        <input type="text" placeholder="payeeAccountNo" class="text8">
+    </div>
+    <p class="p 5"><span>*</span> <b class="p5"></b></p>
+    <div class="box payeeName">
+        <input type="text" placeholder="payeeName" class="text9"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok text2"></div>
+        <!-- 解绑按钮 -->
+        <div class="determine text3"></div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title text4"></div>
+            <div class="soure text5"></div>
+            <div class="countryPub"></div>
+        </div>
+    </div>
+</body>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
+<script src="./js/CARD_USD.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>
--- a/view/molistar/modules/guild-ar/PAYONNER.html
+++ b/view/molistar/modules/guild-ar/PAYONNER.html
@@ -59,6 +59,7 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/PAYONNER.js"></script>
 <script src="../../common/local/langHandler.js"></script>

--- a/view/molistar/modules/guild-ar/USDT.html
+++ b/view/molistar/modules/guild-ar/USDT.html
@@ -55,6 +55,7 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/USDT.js"></script>
 <script src="../../common/local/langHandler.js"></script>

--- a/view/molistar/modules/guild-ar/VODAFONE.html
+++ b/view/molistar/modules/guild-ar/VODAFONE.html
@@ -54,6 +54,7 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/VODAFONE.js"></script>
 <script src="../../common/local/langHandler.js"></script>

--- a/view/molistar/modules/guild-ar/adminSet.html
+++ b/view/molistar/modules/guild-ar/adminSet.html
@@ -58,5 +58,6 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/adminSet.js"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guild-ar/adminSet2.html
+++ b/view/molistar/modules/guild-ar/adminSet2.html
@@ -58,5 +58,6 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/adminSet2.js"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guild-ar/agencyDiamondIncome.html
+++ b/view/molistar/modules/guild-ar/agencyDiamondIncome.html
@@ -80,5 +80,6 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/agencyDiamondIncome.js"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guild-ar/bill.html
+++ b/view/molistar/modules/guild-ar/bill.html
@@ -58,6 +58,7 @@
    <script src="./local/en.js"></script>
    <script src="./local/zh.js"></script>
    <script src="./local/ar.js"></script>
+    <script src="./local/tr.js"></script>
    <script src="./js/bill.js"></script>
    <script src="../../common/local/langHandler.js"></script>
 </body>
--- a/view/molistar/modules/guild-ar/createGuild.html
+++ b/view/molistar/modules/guild-ar/createGuild.html
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></title>
+    <!-- 未加入公会首页 -->
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/createGuild.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/backB.png" alt="">
+        <b class="text1"></b>
+    </div>
+    <!-- 我的信息 -->
+    <div class="myInfo">
+        <img src="./images/logo.png" alt="" class="tx">
+        <p></p>
+        <b></b>
+    </div>
+    <!-- 公会信息 -->
+    <div class="info">
+        <input class="agencyAvatarInput" type="file" id="backImageUpload" accept="image/*" onchange="fileChangeF(event)"
+            class="upload" style="opacity: 0;">
+        <img src="./images/createGuildNull.png" alt="" class="agencyAvatar">
+        <p class="p1"><strong class="text2"></strong><b>*</b></p>
+        <div class="agencyName">
+            <div class="left"><strong class="text3"></strong><b>*</b></div>
+            <input class="right placeholder" type="text" placeholder="">
+        </div>
+        <div class="agentContactInfo">
+            <div class="left"><strong class="text4"></strong><b>*</b></div>
+            <input class="right placeholder" type="text" placeholder="">
+        </div>
+        <div class="agentIDCard"><strong class="text5"></strong><b>*</b></div>
+        <input class="agentIDCardImgInput" type="file" id="backImageUpload2" accept="image/*"
+            onchange="fileChangeF2(event)" class="upload" style="opacity: 0;">
+        <img src="./images/createGuildNull.png" alt="" class="agentIDCardImg">
+    </div>
+    <!-- 邀请人信息 -->
+    <div class="inviterInfo">
+        <div class="InviterId">
+            <div class="left"><strong class="text6"></strong></div>
+            <input class="right placeholder" type="text" placeholder="">
+        </div>
+        <div class="inviterPic"><strong class="text7"></strong></div>
+        <input class="inviterPicImgInput" type="file" id="backImageUpload3" accept="image/*"
+            onchange="fileChangeF3(event)" class="upload" style="opacity: 0;">
+        <img src="./images/createGuildNull.png" alt="" class="inviterPicImg">
+    </div>
+    <!-- 按钮 -->
+    <div class="butBox">Submit</div>
+    <div class="null"></div>
+    <!-- 提交成功弹窗 -->
+    <div class="submitSuccessfully">
+        <div class="submitSuccessfully_in">
+            <div class="title text8"></div>
+            <p class="text9"></p>
+            <div class="but text10"></div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
+<script src="./js/cos-js-sdk-v5.min.js"></script>
+<script src="./js/createGuild.js"></script>
+<script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guild-ar/css/createGuild.css
+++ b/view/molistar/modules/guild-ar/css/createGuild.css
@@ -0,0 +1,369 @@
+html,
+body {
+  width: 100%;
+  height: 17.78667rem;
+  background: #FFFFFF;
+}
+
+.back {
+  width: 100%;
+  height: 2.38667rem;
+  line-height: 3.2rem;
+  position: fixed;
+  left: 0;
+  top: 0rem;
+  text-align: center;
+  color: #333333;
+  font-size: 0.45333rem;
+  font-weight: bold;
+  z-index: 10;
+  background: #fff;
+}
+
+.back img {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 58%;
+}
+
+.myInfo {
+  width: 9.14667rem;
+  height: 2.13333rem;
+  background: #F7F7F7;
+  border-radius: 0.26667rem;
+  margin: 2.6rem auto 0.42667rem;
+  position: relative;
+}
+
+.myInfo .tx {
+  width: 1.6rem;
+  height: 1.6rem;
+  position: absolute;
+  left: 0.32rem;
+  top: 50%;
+  transform: translateY(-50%);
+  border-radius: 50%;
+}
+
+.myInfo p {
+  width: 4.5rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #313131;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  position: absolute;
+  top: 0.50667rem;
+  left: 2.18667rem;
+}
+
+.myInfo b {
+  color: #7B7B7D;
+  font-weight: 400;
+  position: absolute;
+  left: 2.18667rem;
+  top: 1.17333rem;
+  font-size: 0.34667rem;
+}
+
+.info {
+  width: 9.14667rem;
+  height: 11.6rem;
+  background: #F7F7F7;
+  border-radius: 0.26667rem;
+  margin: 0 auto 0.42667rem;
+  position: relative;
+  overflow: hidden;
+}
+
+.info .agencyAvatar {
+  width: 3.01333rem;
+  height: 3.01333rem;
+  position: absolute;
+  top: 0.4rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.info .agencyAvatarInput {
+  width: 3.01333rem;
+  height: 3.01333rem;
+  position: absolute;
+  top: 0.4rem;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 2;
+}
+
+.info .p1 {
+  width: 100%;
+  top: 3.62667rem;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #313131;
+  font-size: 0.32rem;
+  font-weight: 500;
+  position: absolute;
+  text-align: center;
+}
+
+.info .p1 b {
+  color: #FF2C2C;
+}
+
+.info .agencyName {
+  width: 100%;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  border-bottom: 0.01333rem solid #D6D6D6;
+  margin-top: 4.34667rem;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.info .agencyName .left {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.info .agencyName .left b {
+  color: #FF2C2C;
+}
+
+.info .agencyName input {
+  background: none;
+  outline: none;
+  border: none;
+  text-align: right;
+  width: 5rem;
+}
+
+.info .agentContactInfo {
+  width: 100%;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  border-bottom: 0.01333rem solid #D6D6D6;
+  margin-top: 0rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.info .agentContactInfo .left {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.info .agentContactInfo .left b {
+  color: #FF2C2C;
+}
+
+.info .agentContactInfo input {
+  background: none;
+  outline: none;
+  border: none;
+  text-align: right;
+  width: 5rem;
+}
+
+.info .agentIDCard {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  margin-bottom: 0.32rem;
+  white-space: nowrap;
+}
+
+.info .agentIDCard b {
+  color: #FF2C2C;
+}
+
+.info .agentIDCardImg {
+  width: 2.93333rem;
+  height: 2.93333rem;
+  display: inline-block;
+  margin: 0 0.32rem;
+}
+
+.info .agentIDCardImgInput {
+  width: 2.93333rem;
+  height: 2.93333rem;
+  display: inline-block;
+  left: 0.3rem;
+  z-index: 2;
+  position: absolute;
+}
+
+.inviterInfo {
+  width: 9.14667rem;
+  height: 5.92rem;
+  border-radius: 0.26667rem;
+  background: #F7F7F7;
+  margin: 0 auto 0.21333rem;
+}
+
+.inviterInfo .InviterId {
+  width: 100%;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  border-bottom: 0.01333rem solid #D6D6D6;
+  margin-top: 0rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.inviterInfo .InviterId .left {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.inviterInfo .InviterId .left b {
+  color: #FF2C2C;
+}
+
+.inviterInfo .InviterId input {
+  background: none;
+  outline: none;
+  border: none;
+  text-align: right;
+  width: 5rem;
+}
+
+.inviterInfo .inviterPic {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  margin-bottom: 0.32rem;
+}
+
+.inviterInfo .inviterPicImg {
+  width: 2.93333rem;
+  height: 2.93333rem;
+  display: inline-block;
+  margin: 0 0.32rem;
+}
+
+.inviterInfo .inviterPicImgInput {
+  width: 2.93333rem;
+  height: 2.93333rem;
+  display: inline-block;
+  left: 0.8rem;
+  z-index: 2;
+  position: absolute;
+}
+
+.butBox {
+  width: 8.85333rem;
+  height: 1.22667rem;
+  line-height: 1.22667rem;
+  text-align: center;
+  color: #fff;
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+  margin: 0 auto 0;
+  border-radius: 1.22667rem;
+}
+
+.null {
+  height: 0.26667rem;
+}
+
+.submitSuccessfully {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 99;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+
+.submitSuccessfully .submitSuccessfully_in {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 7.73333rem;
+  background: #fff;
+  border-radius: 0.42667rem;
+  padding: 0.37333rem 0.61333rem 0.48rem;
+}
+
+.submitSuccessfully .submitSuccessfully_in .title {
+  color: #313131;
+  font-size: 0.4rem;
+  font-weight: 500;
+  height: 0.56rem;
+  line-height: 0.56rem;
+  margin: 0rem auto 0.32rem;
+  text-align: center;
+}
+
+.submitSuccessfully .submitSuccessfully_in p {
+  width: 100%;
+  color: #313131;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  line-height: 0.48rem;
+}
+
+.submitSuccessfully .submitSuccessfully_in .but {
+  width: 6.50667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  text-align: center;
+  border-radius: 0.96rem;
+  margin: 0.32rem auto 0;
+  color: #fff;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+}
+
+.arabic .info .agentIDCardImgInput {
+  left: auto;
+  right: 0.3rem;
+}
+
+.arabic .inviterInfo .inviterPicImgInput {
+  left: auto;
+  right: 0.8rem;
+}
+
+.arabic .myInfo .tx {
+  left: auto;
+  right: 0.32rem;
+}
+
+.arabic .myInfo b {
+  left: auto;
+  right: 2.18667rem;
+}
+
+.arabic .info .agencyName input,
+.arabic .info .agentContactInfo input,
+.arabic .inviterInfo .InviterId input {
+  text-align: left;
+}
--- a/view/molistar/modules/guild-ar/css/createGuild.scss
+++ b/view/molistar/modules/guild-ar/css/createGuild.scss
@@ -0,0 +1,375 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: px2rem(1334);
+    background: #FFFFFF;
+
+}
+
+.back {
+    width: 100%;
+    height: px2rem(179);
+    line-height: px2rem(240);
+    position: fixed;
+    left: 0;
+    top: px2rem(0);
+    text-align: center;
+    color: #333333;
+    font-size: px2rem(34);
+    font-weight: bold;
+    z-index: 10;
+    background: #fff;
+    // background: url(../images/topBg.png) no-repeat top;
+    // background-size: 100% 7rem;
+
+    img {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: 58%;
+    }
+}
+
+.myInfo {
+    width: px2rem(686);
+    height: px2rem(160);
+    background: #F7F7F7;
+    border-radius: px2rem(20);
+    margin: 2.6rem auto px2rem(32);
+    position: relative;
+
+    .tx {
+        width: px2rem(120);
+        height: px2rem(120);
+        position: absolute;
+        left: px2rem(24);
+        top: 50%;
+        transform: translateY(-50%);
+        border-radius: 50%;
+    }
+
+    p {
+        width: 4.5rem;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        color: #313131;
+        font-size: px2rem(32);
+        font-weight: 500;
+        position: absolute;
+        top: px2rem(38);
+        left: px2rem(164);
+    }
+
+    b {
+        color: #7B7B7D;
+        font-weight: 400;
+        position: absolute;
+        left: px2rem(164);
+        top: px2rem(88);
+        font-size: px2rem(26);
+    }
+}
+
+.info {
+    width: px2rem(686);
+    height: px2rem(870);
+    background: #F7F7F7;
+    border-radius: px2rem(20);
+    margin: 0 auto px2rem(32);
+    position: relative;
+    overflow: hidden;
+
+    .agencyAvatar {
+        width: px2rem(226);
+        height: px2rem(226);
+        position: absolute;
+        top: px2rem(30);
+        left: 50%;
+        transform: translateX(-50%);
+    }
+
+    .agencyAvatarInput {
+        width: px2rem(226);
+        height: px2rem(226);
+        position: absolute;
+        top: px2rem(30);
+        left: 50%;
+        transform: translateX(-50%);
+        z-index: 2;
+    }
+
+    .p1 {
+        width: 100%;
+        top: px2rem(272);
+        left: 50%;
+        transform: translateX(-50%);
+        color: #313131;
+        font-size: px2rem(24);
+        font-weight: 500;
+        position: absolute;
+        text-align: center;
+
+        b {
+            color: #FF2C2C;
+        }
+    }
+
+    .agencyName {
+        width: 100%;
+        height: px2rem(100);
+        line-height: px2rem(100);
+        border-bottom: px2rem(1) solid #D6D6D6;
+        margin-top: px2rem(326);
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+        display: flex;
+        justify-content: space-between;
+
+        .left {
+            color: #313131;
+            font-size: px2rem(28);
+            font-weight: 500;
+            white-space: nowrap;
+            b {
+                color: #FF2C2C;
+            }
+        }
+
+        input {
+            background: none;
+            outline: none;
+            border: none;
+            text-align: right;
+            width: 5rem;
+        }
+    }
+
+    .agentContactInfo {
+        width: 100%;
+        height: px2rem(100);
+        line-height: px2rem(100);
+        border-bottom: px2rem(1) solid #D6D6D6;
+        margin-top: px2rem(0);
+        margin: 0 auto px2rem(30);
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+        display: flex;
+        justify-content: space-between;
+
+        .left {
+            color: #313131;
+            font-size: px2rem(28);
+            font-weight: 500;
+            white-space: nowrap;
+            b {
+                color: #FF2C2C;
+            }
+        }
+
+        input {
+            background: none;
+            outline: none;
+            border: none;
+            text-align: right;
+            width: 5rem;
+        }
+    }
+
+    .agentIDCard {
+        width: 100%;
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+        color: #313131;
+        font-size: px2rem(28);
+        font-weight: 500;
+        margin-bottom: px2rem(24);
+        white-space: nowrap;
+        b {
+            color: #FF2C2C;
+        }
+    }
+
+    .agentIDCardImg {
+        width: px2rem(220);
+        height: px2rem(220);
+        display: inline-block;
+        margin: 0 px2rem(24);
+    }
+
+    .agentIDCardImgInput {
+        width: px2rem(220);
+        height: px2rem(220);
+        display: inline-block;
+        left: 0.3rem;
+        z-index: 2;
+        position: absolute;
+    }
+}
+
+.inviterInfo {
+    width: px2rem(686);
+    height: px2rem(444);
+    border-radius: px2rem(20);
+    background: #F7F7F7;
+    margin: 0 auto px2rem(16);
+
+    .InviterId {
+        width: 100%;
+        height: px2rem(100);
+        line-height: px2rem(100);
+        border-bottom: px2rem(1) solid #D6D6D6;
+        margin-top: px2rem(0);
+        margin: 0 auto px2rem(30);
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+        display: flex;
+        justify-content: space-between;
+
+        .left {
+            color: #313131;
+            font-size: px2rem(28);
+            font-weight: 500;
+            white-space: nowrap;
+            b {
+                color: #FF2C2C;
+            }
+        }
+
+        input {
+            background: none;
+            outline: none;
+            border: none;
+            text-align: right;
+            width: 5rem;
+        }
+    }
+
+    .inviterPic {
+        width: 100%;
+        box-sizing: border-box;
+        padding: 0 px2rem(24);
+        color: #313131;
+        font-size: px2rem(28);
+        font-weight: 500;
+        margin-bottom: px2rem(24);
+    }
+
+    .inviterPicImg {
+        width: px2rem(220);
+        height: px2rem(220);
+        display: inline-block;
+        margin: 0 px2rem(24);
+    }
+
+    .inviterPicImgInput {
+        width: px2rem(220);
+        height: px2rem(220);
+        display: inline-block;
+        left: 0.8rem;
+        z-index: 2;
+        position: absolute;
+    }
+}
+
+.butBox {
+    width: px2rem(664);
+    height: px2rem(92);
+    line-height: px2rem(92);
+    text-align: center;
+    color: #fff;
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+    margin: 0 auto 0;
+    border-radius: px2rem(92);
+}
+
+.null {
+    height: px2rem(20);
+}
+
+.submitSuccessfully {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 99;
+    background: rgba(0, 0, 0, .5);
+    display: none;
+
+    .submitSuccessfully_in {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        width: px2rem(580);
+        // height: px2rem(406);
+        background: #fff;
+        border-radius: px2rem(32);
+        padding: px2rem(28) px2rem(46) px2rem(36);
+
+        .title {
+            color: #313131;
+            font-size: px2rem(30);
+            font-weight: 500;
+            height: px2rem(42);
+            line-height: px2rem(42);
+            margin: px2rem(0) auto px2rem(24);
+            text-align: center;
+        }
+
+        p {
+            width: 100%;
+            color: #313131;
+            font-size: px2rem(26);
+            font-weight: 400;
+            line-height: px2rem(36);
+        }
+
+        .but {
+            width: px2rem(488);
+            height: px2rem(72);
+            line-height: px2rem(72);
+            text-align: center;
+            border-radius: px2rem(72);
+            margin: px2rem(24) auto 0;
+            color: #fff;
+            font-size: px2rem(28);
+            font-weight: 500;
+            background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+        }
+    }
+}
+
+.arabic {
+    .info .agentIDCardImgInput {
+        left: auto;
+        right: 0.3rem;
+    }
+
+    .inviterInfo .inviterPicImgInput {
+        left: auto;
+        right: 0.8rem;
+    }
+
+    .myInfo .tx {
+        left: auto;
+        right: 0.32rem;
+    }
+
+    .myInfo b {
+        left: auto;
+        right: 2.18667rem;
+    }
+
+    .info .agencyName input,
+    .info .agentContactInfo input,
+    .inviterInfo .InviterId input {
+        text-align: left;
+    }
+}
--- a/view/molistar/modules/guild-ar/css/guild.css
+++ b/view/molistar/modules/guild-ar/css/guild.css
@@ -2,7 +2,7 @@ html,
 body {
  width: 100%;
  height: 17.78667rem;
-  background: #F5F7F9;
+  background: #FFFFFF;
 }

 .back {
@@ -17,8 +17,7 @@ body {
  font-size: 0.45333rem;
  font-weight: bold;
  z-index: 10;
-  background: url(../images/topBg.png) no-repeat top;
-  background-size: 100% 7rem;
+  background: #fff;
 }

 .back img {
@@ -30,16 +29,17 @@ body {
 }

 .top {
-  width: 9.25333rem;
-  height: 1.18667rem;
-  line-height: 0.78667rem;
-  background: #fff;
-  border-radius: 0.26667rem 0.26667rem 0 0;
+  width: 9.2rem;
+  height: 0.90667rem;
+  line-height: 0.90667rem;
+  background: #F7F7F7;
+  border-radius: 0.90667rem;
  margin: 2.5rem auto 0;
  color: #333;
  font-size: 0.42667rem;
  box-sizing: border-box;
  padding: 0 0.4rem;
+  position: relative;
 }

 .top .left {
@@ -48,21 +48,41 @@ body {
  float: left;
 }

+.top input {
+  width: 8.13333rem;
+  height: 0.90667rem;
+  background: none;
+  position: absolute;
+  left: 0.98667rem;
+  top: 0;
+  font-size: 0.37333rem;
+  border: none;
+  outline: none;
+  color: #313131;
+}
+
+.top input::placeholder {
+  color: #AFB1B3;
+}
+
 .top img {
-  float: right;
-  display: block;
-  width: 0.58667rem;
-  height: 0.58667rem;
-  margin-top: 0.33333rem;
+  position: absolute;
+  left: 0.32rem;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 0.53333rem;
+  height: 0.53333rem;
 }

 ul {
  width: 9.25333rem;
  height: 16.81333rem;
  overflow-y: scroll;
-  margin: 0 auto;
+  margin: 0.53333rem auto 0;
  border-radius: 0 0 0.26667rem 0.26667rem;
  background: #fff;
+  padding-top: 0.26667rem;
+  box-sizing: border-box;
 }

 ul::-webkit-scrollbar {
@@ -70,119 +90,122 @@ ul::-webkit-scrollbar {
 }

 ul li {
-  width: 100%;
-  height: 2.13333rem;
-  overflow: hidden;
-  box-sizing: border-box;
-  padding: 0 0.26667rem 0 0.2rem;
+  width: 9.14667rem;
+  height: 2.24rem;
+  background: url(../images/guildLiBg.png) no-repeat;
+  background-size: 100% 100%;
+  margin-bottom: 0.66667rem;
  position: relative;
-}
-
-ul li .num {
-  color: #000000;
-  font-size: 0.4rem;
-  font-weight: bold;
-  width: 1.01333rem;
-  height: 1.01333rem;
-  line-height: 1.01333rem;
-  text-align: center;
-  float: left;
-  margin-top: 0.66667rem;
-}
-
-ul li .ts {
-  width: 1.54667rem;
-  height: 1.54667rem;
-  position: absolute;
-  z-index: 2;
-  left: 1.09333rem;
-  top: 0.49333rem;
+  overflow: visible;
 }

 ul li .tx {
-  width: 1.4rem;
-  height: 1.45rem;
+  width: 2.21333rem;
+  height: 2.21333rem;
+  border-radius: 0.21333rem;
+  border: 0.04rem solid #FFD65E;
  position: absolute;
-  left: 1.2rem;
-  top: 0.46rem;
-  border-radius: 0.1rem;
+  left: 0.26667rem;
+  top: -0.24rem;
 }

-ul li .user {
-  float: left;
-  margin-left: 1.66667rem;
-}
-
-ul li .user p {
-  width: 2.5rem;
+ul li p {
+  width: 4rem;
+  position: absolute;
+  top: 0.26667rem;
+  left: 2.8rem;
+  color: #FFDD7A;
+  font-size: 0.42667rem;
+  font-weight: 500;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
-  color: #515665;
-  font-size: 0.32rem;
-  margin-bottom: 0.38667rem;
-  font-weight: bold;
-  box-sizing: border-box;
-  padding-top: 0.70667rem;
 }

-ul li .user b {
-  color: #A4ABB2;
+ul li span {
+  width: 4rem;
+  height: 0.42667rem;
+  line-height: 0.42667rem;
+  position: absolute;
+  top: 1.33333rem;
+  left: 2.8rem;
+}
+
+ul li span img {
+  display: inline-block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+}
+
+ul li span b {
+  display: inline-block;
+  color: #FFDD7A;
  font-size: 0.32rem;
-  font-weight: 500;
+  font-weight: 400;
+}
+
+ul li strong {
+  position: absolute;
+  color: #FFDD7A;
+  font-weight: 400;
+  position: absolute;
+  left: 2.8rem;
+  top: 0.86667rem;
+}
+
+ul li .level {
+  width: 0.8rem;
+  height: 0.8rem;
+  position: absolute;
+  right: 0.69333rem;
+  top: 0.26667rem;
 }

 ul li .but {
-  width: 1.54667rem;
-  height: 0.56rem;
-  line-height: 0.56rem;
-  background: #7F95FF;
-  border-radius: 0.56rem;
-  float: right;
-  margin-top: 0.76rem;
+  width: 1.6rem;
+  height: 0.69333rem;
+  line-height: 0.64rem;
  text-align: center;
  color: #fff;
-  font-size: 0.26667rem;
+  font-size: 0.37333rem;
+  position: absolute;
+  right: 0.29333rem;
+  top: 1.22667rem;
+  border-radius: 0.69333rem;
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
 }

-ul li:nth-child(odd) {
-  background: rgba(50, 39, 79, 0.06);
+ul li .act {
+  top: 50%;
+  transform: translateY(-50%);
 }

-ul li:nth-child(1) .num {
-  background: url(../images/no1.png) no-repeat;
-  background-size: 100% 100%;
+ul .null {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: none;
 }

-ul li:nth-child(1) .ts {
-  width: 1.78667rem;
-  height: 1.78667rem;
-  left: 1.05333rem;
-  top: 0.18667rem;
+ul .null img {
+  width: 1.96rem;
+  height: 2.01333rem;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
 }

-ul li:nth-child(2) .num {
-  background: url(../images/no2.png) no-repeat;
-  background-size: 100% 100%;
-}
-
-ul li:nth-child(2) .ts {
-  width: 1.78667rem;
-  height: 1.78667rem;
-  left: 1.05333rem;
-  top: 0.18667rem;
-}
-
-ul li:nth-child(3) .num {
-  background: url(../images/no3.png) no-repeat;
-  background-size: 100% 100%;
-}
-
-ul li:nth-child(3) .ts {
-  width: 1.78667rem;
-  height: 1.78667rem;
-  left: 1.05333rem;
-  top: 0.18667rem;
+ul .null span {
+  width: 100%;
+  left: 0;
+  top: 55%;
+  transform: translateY(-50%);
+  color: #A9A9A9;
+  font-size: 0.4rem;
+  font-weight: 400;
+  position: absolute;
+  text-align: center;
 }

 .pub {
@@ -241,28 +264,29 @@ ul li:nth-child(3) .ts {
  color: #fff;
 }

-.arabic ul li .num,
-.arabic ul li .user {
-  float: right;
-}
-
-.arabic ul li .user {
-  margin-left: 0;
-  margin-right: 1.8rem;
-}
-
 .arabic ul li .but {
-  float: left;
+  right: auto;
+  left: 0.29333rem;
 }

-.arabic ul li .ts {
-  left: 0;
-  right: 1.05333rem;
+.arabic ul li .level {
+  right: auto;
+  left: 0.69333rem;
 }

 .arabic ul li .tx {
-  left: 0;
-  right: 1.28rem;
+  right: 0.26667rem;
+  left: auto;
+}
+
+.arabic ul li p {
+  right: 2.8rem;
+  left: auto;
+}
+
+.arabic ul li span {
+  right: 2.8rem;
+  left: auto;
 }

 .arabic .top .left {
@@ -272,3 +296,73 @@ ul li:nth-child(3) .ts {
 .arabic .top img {
  float: left;
 }
+
+.create {
+  position: fixed;
+  z-index: 2;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0.88rem;
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+  width: 6.24rem;
+  height: 1.17333rem;
+  line-height: 1.17333rem;
+  text-align: center;
+  color: #fff;
+  font-size: 0.42667rem;
+  border-radius: 1.17333rem;
+}
+
+.submitSuccessfully {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 99;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+
+.submitSuccessfully .submitSuccessfully_in {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 7.73333rem;
+  background: #fff;
+  border-radius: 0.42667rem;
+  padding: 0.37333rem 0.61333rem 0.48rem;
+}
+
+.submitSuccessfully .submitSuccessfully_in .title {
+  color: #313131;
+  font-size: 0.4rem;
+  font-weight: 500;
+  height: 0.56rem;
+  line-height: 0.56rem;
+  margin: 0rem auto 0.32rem;
+  text-align: center;
+}
+
+.submitSuccessfully .submitSuccessfully_in p {
+  width: 100%;
+  color: #313131;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  line-height: 0.48rem;
+  text-align: center;
+}
+
+.submitSuccessfully .submitSuccessfully_in .but {
+  width: 6.50667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  text-align: center;
+  border-radius: 0.96rem;
+  margin: 0.32rem auto 0;
+  color: #fff;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+}
--- a/view/molistar/modules/guild-ar/css/guild.scss
+++ b/view/molistar/modules/guild-ar/css/guild.scss
@@ -6,7 +6,7 @@ html,
 body {
    width: 100%;
    height: px2rem(1334);
-    background: #F5F7F9;
+    background: #FFFFFF;

 }

@@ -22,8 +22,9 @@ body {
    font-size: px2rem(34);
    font-weight: bold;
    z-index: 10;
-    background: url(../images/topBg.png) no-repeat top;
-    background-size: 100% 7rem;
+    background: #fff;
+    // background: url(../images/topBg.png) no-repeat top;
+    // background-size: 100% 7rem;

    img {
        width: px2rem(44);
@@ -35,16 +36,17 @@ body {
 }

 .top {
-    width: px2rem(694);
-    height: px2rem(89);
-    line-height: px2rem(59);
-    background: #fff;
-    border-radius: px2rem(20) px2rem(20) 0 0;
+    width: px2rem(690);
+    height: px2rem(68);
+    line-height: px2rem(68);
+    background: #F7F7F7;
+    border-radius: px2rem(68);
    margin: 2.5rem auto 0;
    color: #333;
    font-size: px2rem(32);
    box-sizing: border-box;
    padding: 0 px2rem(30);
+    position: relative;

    .left {
        height: px2rem(89);
@@ -52,12 +54,30 @@ body {
        float: left;
    }

+    input {
+        width: px2rem(610);
+        height: px2rem(68);
+        background: none;
+        position: absolute;
+        left: px2rem(74);
+        top: 0;
+        font-size: px2rem(28);
+        border: none;
+        outline: none;
+        color: #313131;
+
+        &::placeholder {
+            color: #AFB1B3;
+        }
+    }
+
    img {
-        float: right;
-        display: block;
-        width: px2rem(44);
-        height: px2rem(44);
-        margin-top: px2rem(25);
+        position: absolute;
+        left: px2rem(24);
+        top: 50%;
+        transform: translateY(-50%);
+        width: px2rem(40);
+        height: px2rem(40);
    }
 }

@@ -65,135 +85,131 @@ ul {
    width: px2rem(694);
    height: px2rem(1261);
    overflow-y: scroll;
-    margin: 0 auto;
+    margin: px2rem(40) auto 0;
    border-radius: 0 0 px2rem(20) px2rem(20);
    background: #fff;
+    padding-top: px2rem(20);
+    box-sizing: border-box;

    &::-webkit-scrollbar {
        display: none;
    }

    li {
-        width: 100%;
-        height: px2rem(160);
-        overflow: hidden;
-        box-sizing: border-box;
-        padding: 0 px2rem(20) 0 px2rem(15);
+        width: px2rem(686);
+        height: px2rem(168);
+        background: url(../images/guildLiBg.png) no-repeat;
+        background-size: 100% 100%;
+        margin-bottom: px2rem(50);
        position: relative;
-
-        .num {
-            color: #000000;
-            font-size: px2rem(30);
-            font-weight: bold;
-            width: px2rem(76);
-            height: px2rem(76);
-            line-height: px2rem(76);
-            text-align: center;
-            float: left;
-            margin-top: px2rem(50);
-        }
-
-        .ts {
-            width: px2rem(116);
-            height: px2rem(116);
-            position: absolute;
-            z-index: 2;
-            left: px2rem(82);
-            top: px2rem(37);
-        }
+        overflow: visible;

        .tx {
-            width: 1.4rem;
-            height: 1.45rem;
+            width: px2rem(166);
+            height: px2rem(166);
+            border-radius: px2rem(16);
+            border: px2rem(3) solid #FFD65E;
            position: absolute;
-            left: 1.2rem;
-            top: 0.46rem;
-            border-radius: 0.1rem;
+            left: px2rem(20);
+            top: px2rem(-18);
        }

-        .user {
-            float: left;
-            margin-left: px2rem(125);
+        p {
+            width: 4rem;
+            position: absolute;
+            top: px2rem(20);
+            left: px2rem(210);
+            color: #FFDD7A;
+            font-size: px2rem(32);
+            font-weight: 500;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+        }

-            p {
-                width: 2.5rem;
-                overflow: hidden;
-                white-space: nowrap;
-                text-overflow: ellipsis;
-                color: #515665;
-                font-size: px2rem(24);
-                margin-bottom: px2rem(29);
-                font-weight: bold;
-                box-sizing: border-box;
-                padding-top: px2rem(53);
+        span {
+            width: 4rem;
+            height: px2rem(32);
+            line-height: px2rem(32);
+            position: absolute;
+            top: px2rem(100);
+            left: px2rem(210);
+
+            img {
+                display: inline-block;
+                width: px2rem(32);
+                height: px2rem(32);
            }

            b {
-                color: #A4ABB2;
+                display: inline-block;
+                color: #FFDD7A;
                font-size: px2rem(24);
-                font-weight: 500;
+                font-weight: 400;
            }
        }
+        strong{
+            position: absolute;
+            color: #FFDD7A;
+            font-weight: 400;
+            position: absolute;
+            left: 2.8rem;
+            top: px2rem(65);
+        }
+        .level {
+            width: px2rem(60);
+            height: px2rem(60);
+            position: absolute;
+            right: px2rem(52);
+            top: px2rem(20);
+        }

        .but {
-            width: px2rem(116);
-            height: px2rem(42);
-            line-height: px2rem(42);
-            background: #7F95FF;
-            border-radius: px2rem(42);
-            float: right;
-            margin-top: px2rem(57);
+            width: px2rem(120);
+            height: px2rem(52);
+            line-height: px2rem(48);
            text-align: center;
            color: #fff;
-            font-size: px2rem(20);
+            font-size: px2rem(28);
+            position: absolute;
+            right: px2rem(22);
+            top: px2rem(92);
+            border-radius: px2rem(52);
+            background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
        }

-        &:nth-child(odd) {
-            background: rgba(50, 39, 79, .06);
+        .act {
+            top: 50%;
+            transform: translateY(-50%);
+        }
+    }
+
+    .null {
+        width: 100%;
+        height: 100%;
+        position: relative;
+        background: none;
+
+        img {
+            width: px2rem(147);
+            height: px2rem(151);
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            transform: translate(-50%, -50%);
        }

-        &:nth-child(1) {
-            .num {
-                background: url(../images/no1.png) no-repeat;
-                background-size: 100% 100%;
-            }
-
-            .ts {
-                width: px2rem(134);
-                height: px2rem(134);
-                left: px2rem(79);
-                top: px2rem(14);
-            }
+        span {
+            width: 100%;
+            left: 0;
+            top: 55%;
+            transform: translateY(-50%);
+            color: #A9A9A9;
+            font-size: px2rem(30);
+            font-weight: 400;
+            position: absolute;
+            text-align: center;
        }
-
-        &:nth-child(2) {
-            .num {
-                background: url(../images/no2.png) no-repeat;
-                background-size: 100% 100%;
-            }
-
-            .ts {
-                width: px2rem(134);
-                height: px2rem(134);
-                left: px2rem(79);
-                top: px2rem(14);
-            }
-        }
-
-        &:nth-child(3) {
-            .num {
-                background: url(../images/no3.png) no-repeat;
-                background-size: 100% 100%;
-            }
-
-            .ts {
-                width: px2rem(134);
-                height: px2rem(134);
-                left: px2rem(79);
-                top: px2rem(14);
-            }
-        }
-
    }
 }

@@ -254,29 +270,27 @@ ul {
 }

 .arabic {
-
-    ul li .num,
-    ul li .user {
-        float: right;
-    }
-
-    ul li .user {
-        margin-left: 0;
-        margin-right: 1.8rem;
-    }
-
    ul li .but {
-        float: left;
+        right: auto;
+        left: 0.29333rem;
    }

-    ul li .ts {
-        left: 0;
-        right: 1.05333rem;
+    ul li .level {
+        right: auto;
+        left: 0.69333rem;
    }

    ul li .tx {
-        left: 0;
-        right: 1.28rem;
+        right: 0.26667rem;
+        left: auto;
+    }
+    ul li p{
+        right: 2.8rem;
+        left: auto;
+    }
+    ul li span{
+        right: 2.8rem;
+        left: auto;
    }

    .top .left {
@@ -286,4 +300,75 @@ ul {
    .top img {
        float: left;
    }
+}
+
+.create {
+    position: fixed;
+    z-index: 2;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: px2rem(66);
+    background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+    width: px2rem(468);
+    height: px2rem(88);
+    line-height: px2rem(88);
+    text-align: center;
+    color: #fff;
+    font-size: px2rem(32);
+    border-radius: px2rem(88);
+}
+
+.submitSuccessfully {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 99;
+    background: rgba(0, 0, 0, .5);
+    display: none;
+
+    .submitSuccessfully_in {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        width: px2rem(580);
+        // height: px2rem(406);
+        background: #fff;
+        border-radius: px2rem(32);
+        padding: px2rem(28) px2rem(46) px2rem(36);
+
+        .title {
+            color: #313131;
+            font-size: px2rem(30);
+            font-weight: 500;
+            height: px2rem(42);
+            line-height: px2rem(42);
+            margin: px2rem(0) auto px2rem(24);
+            text-align: center;
+        }
+
+        p {
+            width: 100%;
+            color: #313131;
+            font-size: px2rem(26);
+            font-weight: 400;
+            line-height: px2rem(36);
+            text-align: center;
+        }
+
+        .but {
+            width: px2rem(488);
+            height: px2rem(72);
+            line-height: px2rem(72);
+            text-align: center;
+            border-radius: px2rem(72);
+            margin: px2rem(24) auto 0;
+            color: #fff;
+            font-size: px2rem(28);
+            font-weight: 500;
+            background: linear-gradient(270deg, #E29030 0%, #FCC074 100%);
+        }
+    }
 }
--- a/view/molistar/modules/guild-ar/css/index.css
+++ b/view/molistar/modules/guild-ar/css/index.css
@@ -181,6 +181,7 @@ body {
  padding: 0 0.13333rem;
  position: relative;
  word-spacing: normal;
+  white-space: nowrap;
 }

 .headerBox .headerBox_in div img {
@@ -720,17 +721,17 @@ body {
 }

 .guildList ul li .administrator {
-  width: 1.04rem;
-  height: 0.34667rem;
-  line-height: 0.34667rem;
-  border-radius: 0.34667rem;
+  width: 1.2rem;
+  height: 0.45333rem;
+  line-height: 0.45333rem;
+  border-radius: 0.45333rem;
  text-align: center;
  color: #333;
  font-size: 0.29333rem;
  font-weight: 400;
  position: absolute;
-  left: 0.26667rem;
-  top: 0.94667rem;
+  left: 0.37333rem;
+  top: 1.30667rem;
  background: linear-gradient(-90deg, #FBE1FF, #F090FF);
  display: none;
 }
--- a/view/molistar/modules/guild-ar/css/index.scss
+++ b/view/molistar/modules/guild-ar/css/index.scss
@@ -186,6 +186,7 @@ body {
            padding: 0 px2rem(10);
            position: relative;
            word-spacing: normal;
+            white-space: nowrap;

            img {
                display: inline;
@@ -736,17 +737,17 @@ body {
            }

            .administrator {
-                width: px2rem(78);
-                height: px2rem(26);
-                line-height: px2rem(26);
-                border-radius: px2rem(26);
+                width: px2rem(90);
+                height: px2rem(34);
+                line-height: px2rem(34);
+                border-radius: px2rem(34);
                text-align: center;
                color: #333;
                font-size: px2rem(22);
                font-weight: 400;
                position: absolute;
-                left: px2rem(20);
-                top: px2rem(71);
+                left: px2rem(28);
+                top: px2rem(98);
                background: linear-gradient(-90deg, #FBE1FF, #F090FF);
                display: none;
            }
--- a/view/molistar/modules/guild-ar/diamondWithdraw.html
+++ b/view/molistar/modules/guild-ar/diamondWithdraw.html
@@ -18,7 +18,7 @@
    </div>
    <!-- 我的钻石 -->
    <div class="myDiamond">
-        <i>My diamond: </i>
+        <i class="text9">My diamond: </i>
        <b>0</b>
        <img src="./images/diamond.png" alt="">
    </div>
@@ -62,5 +62,6 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <script src="./js/diamondWithdraw.js"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guild-ar/guide.html
+++ b/view/molistar/modules/guild-ar/guide.html
@@ -39,6 +39,7 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
+<script src="./local/tr.js"></script>
 <!-- <script src="./js/guide.js"></script> -->
 <script src="../../common/local/langHandler.js"></script>
 <script>
--- a/view/molistar/modules/guild-ar/guild.html
+++ b/view/molistar/modules/guild-ar/guild.html
@@ -7,7 +7,7 @@
    <title class="text1"></title>
    <!-- 未加入公会首页 -->
    <link rel="stylesheet" href="../../common/css/reset.css">
-    <link rel="stylesheet" href="./css/guild.css?v=1.1">
+    <link rel="stylesheet" href="./css/guild.css">
 </head>

 <body>
@@ -18,52 +18,21 @@
    </div>
    <!-- 头部 -->
    <div class="top">
-        <div class="left text3"></div>
+        <input class="placeholder" type="text" placeholder="Please enter the Agency ID/Agent ID to search">
        <img src="./images/fdj.png" alt="">
    </div>
    <!-- 列表 -->
    <ul>
        <!-- <li>
-            <div class="num"></div>
-            <img src="./images/ts1.png" alt="" class="ts">
-            <img src="./images/logo.png" alt="" class="tx">
-            <div class="user">
-                <p>名称</p>
-                <b>ID:0</b>
-            </div>
-            <div class="but">طلب إضافة </div>
-        </li>
-        <li>
-            <div class="num"></div>
-            <img src="./images/ts2.png" alt="" class="ts">
-            <img src="./images/logo.png" alt="" class="tx">
-            <div class="user">
-                <p>名称</p>
-                <b>ID:0</b>
-            </div>
-            <div class="but">طلب إضافة </div>
-        </li>
-        <li>
-            <div class="num"></div>
-            <img src="./images/ts3.png" alt="" class="ts">
-            <img src="./images/logo.png" alt="" class="tx">
-            <div class="user">
-                <p>名称</p>
-                <b>ID:0</b>
-            </div>
-            <div class="but">طلب إضافة </div>
-        </li>
-        <li>
-            <div class="num">4</div>
-            <img src="./images/txK.png" alt="" class="ts">
-            <img src="./images/logo.png" alt="" class="tx">
-            <div class="user">
-                <p>名称</p>
-                <b>ID:0</b>
-            </div>
-            <div class="but">طلب إضافة </div>
+            <img class="tx" src="./images/null.png" alt="">
+            <p>名字</p>
+            <span><img src="./images/xren.png" alt=""> <b>0/100</b></span>
+            <img class="level" src="./images/SS.png" alt="">
+            <div class="but">Join</div>
        </li> -->
    </ul>
+    <!-- 创建公会 -->
+    <div class="create newText1"></div>
    <!-- 确认加入公会弹窗 -->
    <div class="pub">
        <div class="pub_in">
@@ -74,6 +43,14 @@
            </div>
        </div>
    </div>
+    <!-- 提交成功弹窗 -->
+    <div class="submitSuccessfully">
+        <div class="submitSuccessfully_in">
+            <div class="title newText2"></div>
+            <p class="newText3"></p>
+            <div class="but text6">OK</div>
+        </div>
+    </div>
 </body>

 </html>
@@ -86,5 +63,6 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
-<script src="./js/guild.js?v=1.0"></script>
+<script src="./local/tr.js"></script>
+<script src="./js/guild.js?v=2"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
dragon	642a6a67cc	新增举报条目以及多语言土耳其	2024-12-18 20:37:14 +08:00
dragon	b9c37104be	替换sid规则	2024-12-13 19:08:06 +08:00
dragon	b85d1a6838	修复搜索公会等级图片异常问题	2024-12-11 14:54:56 +08:00
dragon	5eef1fe919	优化样式	2024-12-11 10:49:41 +08:00
dragon	2e0da65437	新增翻译	2024-12-10 18:44:44 +08:00
dragon	1122a322fa	修复公会修改头像异常问题	2024-12-10 18:44:44 +08:00
dragon	f833af56e2	‘修改提交成功的确认弹窗’	2024-12-10 18:44:44 +08:00
dragon	51eb0e016a	处理弹窗	2024-12-10 18:44:44 +08:00
dragon	3d58b7fe5e	新增创建公会	2024-12-10 18:44:44 +08:00
dragon	ccf6290017	修复超级id土耳其报错异常问题	2024-12-10 18:44:28 +08:00
dragon	0fb3eb9550	修改土耳其金币奖励规则	2024-12-09 17:46:53 +08:00
dragon	4bee20a482	修复进图条样式	2024-12-08 03:13:52 +08:00
dragon	7227fc9465	修改财富魅力等级下一级所需值算法	2024-12-08 02:16:24 +08:00
dragon	4abf36429b	修改翻译	2024-12-06 19:04:31 +08:00
dragon	59265ac0a3	优化样式官网\	2024-12-06 17:53:16 +08:00
dragon	20e8b58ec8	恢复默认uid	2024-12-06 17:34:04 +08:00
dragon	52be806311	优化样式	2024-12-06 17:27:29 +08:00
dragon	96eb7648e1	修改样式	2024-12-06 17:22:59 +08:00
dragon	471fb2e606	修改官网样式	2024-12-06 16:51:35 +08:00
dragon	0c44fd7e95	优化官网加新增土耳其提现	2024-12-06 16:07:09 +08:00
dragon	505c6d4bd1	官网土耳其土耳其化	2024-12-06 14:43:54 +08:00
dragon	ad37da5a4a	清除缓存	2024-12-05 21:13:04 +08:00
dragon	197cdeadb5	处理五福短字段没返回设置默认值	2024-12-05 18:37:02 +08:00
dragon	ba78c6ddc6	新增活动土耳其	2024-12-05 15:44:20 +08:00
dragon	97c4dd7f56	修改工会翻译	2024-12-04 18:45:14 +08:00
dragon	be384050a4	修改样式	2024-12-03 10:22:39 +08:00
dragon	163f49ad8b	重构等级	2024-12-03 10:22:38 +08:00
dragon	b32b5e7b90	魅力等级暂存	2024-12-03 10:22:38 +08:00
dragon	29cd75811f	优化样式修改翻译	2024-12-02 18:22:13 +08:00
dragon	1b7046d18d	修改翻译	2024-12-02 17:29:40 +08:00
dragon	92041337ca	修改翻译文案	2024-12-02 15:47:18 +08:00
dragon	1b34ca7af5	替换图片	2024-12-02 15:23:49 +08:00
dragon	6d6f2ca54c	样式修改	2024-12-02 14:54:09 +08:00
dragon	fad16b329f	修复样式问题	2024-12-02 14:07:32 +08:00
dragon	eac76abd51	完成定制礼物	2024-11-29 17:24:18 +08:00
dragon	57807aac09	完成定制活动接口联调，ui暂存	2024-11-29 14:14:04 +08:00
dragon	a465ef6820	公会土耳其修改翻译	2024-11-29 12:01:11 +08:00
dragon	7a6ae994df	修改翻译	2024-11-27 18:14:38 +08:00
dragon	2a2d75c124	修改翻译土耳其公会	2024-11-27 18:00:59 +08:00
dragon	ad66c7f37f	修改土耳其错误翻译	2024-11-27 17:03:40 +08:00
dragon	85a40558f8	兼容tr以及翻译公会土耳其	2024-11-26 18:48:27 +08:00