diff --git a/css/secure.css b/css/secure.css
index 084702d..2f69875 100644
--- a/css/secure.css
+++ b/css/secure.css
@@ -19,9 +19,9 @@ body {
    width: 100%;
   min-height: 100vh;
   background: url("../images/img2.png");
-  background-repeat: no-repeat; 
+  background-repeat: no-repeat;
   background-position: right top;
-  background-size: contain; 
+  background-size: contain;
 } */
 .secure-content-wrap{
   /* padding: 8rem 0; */
@@ -133,6 +133,23 @@ body {
   margin-top: -17.5rem;
   box-sizing: border-box;
 }
+.tc-popup {
+  background: #FFFFFF;
+  box-shadow: 0px 0px 3px 0px rgba(15,80,178,0.51);
+  border-radius: 4px;
+  padding: 4.375rem 3.75rem;
+  position: fixed;
+  /* top: 26%;
+  left: 36%; */
+  z-index: 90;
+  width: 32.5rem;
+  left: 25%;
+  margin-left: -16.25rem;
+  height: 40rem;
+  top: 50%;
+  margin-top: -17.5rem;
+  box-sizing: border-box;
+}
 .popup-content__item {
   margin-bottom: 1.25rem;
 }
@@ -353,4 +370,4 @@ body {
     width: 100%;
     height: 100%;
   }
-}
\ No newline at end of file
+}
diff --git a/images/FigmaDDSSlicePNGb036e0276b958fac7a72814f195c50b0.png b/images/FigmaDDSSlicePNGb036e0276b958fac7a72814f195c50b0.png
new file mode 100644
index 0000000..f75c414
Binary files /dev/null and b/images/FigmaDDSSlicePNGb036e0276b958fac7a72814f195c50b0.png differ
diff --git a/images/FigmaDDSSlicePNGba1504f367f579c6504830b2cee83a77.png b/images/FigmaDDSSlicePNGba1504f367f579c6504830b2cee83a77.png
new file mode 100644
index 0000000..6cf9289
Binary files /dev/null and b/images/FigmaDDSSlicePNGba1504f367f579c6504830b2cee83a77.png differ
diff --git a/images/unchoice.png b/images/unchoice.png
new file mode 100644
index 0000000..8794107
Binary files /dev/null and b/images/unchoice.png differ
diff --git a/secure.html b/secure.html
index d6d0874..7a0ebe8 100644
--- a/secure.html
+++ b/secure.html
@@ -1,169 +1,361 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
-  <head>
+<head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./css/secure.css">
     <title>独立站安全</title>
-  </head>
-  <!-- 嵌入头部 -->
-  <script type="text/javascript" src = "./js/jquery.js"></script>
-  <script>
-    $(function(){
-      $("#header").load("./header.html");
+</head>
+<!-- 嵌入头部 -->
+<script type="text/javascript" src="./js/jquery.js"></script>
+<script>
+    $(function () {
+        $("#header").load("./header.html");
     });
-    $(function(){
-      $("#footer").load("./footer.html");
+    $(function () {
+        $("#footer").load("./footer.html");
     });
-  </script>
-  <body>
-    <div class="secure">
-      <div class="secure-box">
+</script>
+<body>
+<div class="secure">
+    <div class="secure-box">
         <!-- 头部占位 -->
         <div id="header"></div>
-
         <!-- 页面内容 -->
         <div class="secure-content-wrap">
-          <div class="secure-content">
+            <div class="secure-content">
 
-            <div class="secure-content__left">
-              <div class="secure-content--title">三种模式总有一款适合您</div>
-              <div class="secure-content--model">
-                <div class="secure-content--model__item">
-                  <div class="secure-content--model__round"></div>
-                  <div>您可以只购买我们的独立站</div>
+                <div class="secure-content__left">
+                    <div class="secure-content--title">三种模式总有一款适合您</div>
+                    <div class="secure-content--model">
+                        <div class="secure-content--model__item">
+                            <div class="secure-content--model__round"></div>
+                            <div>如果您有独立站，可以直接购买安全微服务套餐</div>
+                        </div>
+                        <div class="secure-content--model__item">
+                            <div class="secure-content--model__round"></div>
+                            <div>您购买安全微服务套餐，我们送您独立站</div>
+                        </div>
+                        <div class="secure-content--model__item">
+                            <div class="secure-content--model__round"></div>
+                            <div>您可以只购买我们的独立站</div>
+                        </div>
+                    </div>
                 </div>
-                <div class="secure-content--model__item">
-                  <div class="secure-content--model__round"></div>
-                  <div>如果您已有独立站，可以直接购买安全微服务套餐</div>
+                <div class="secure-content__right">
+                    <img class="secure--content__right--image" src="./images/img2.png">
                 </div>
-                <div class="secure-content--model__item">
-                  <div class="secure-content--model__round"></div>
-                  <div>若您购买安全微服务套餐，我们还将赠送您独立站</div>
+            </div>
+            <div class="secure-content--operate">
+                <div class="secure-content--operate__made" onclick="openPopuptc()">定制我的套餐</div>
+                <div class="secure-content--operate__connect" onclick="openPopup()">联系我们</div>
+            </div>
+        </div>
+    </div>
+    <!-- 底部占位 -->
+    <div id="footer"></div>
+    <!-- 弹窗: 定制我的套餐 -->
+    <div id="tcpopup" class="tc-popup" style="display: none;width: 80%">
+        <div class="secure-popup__close" onclick="closePopuptc()">
+            <img src="./images/close.png">
+        </div>
+        <div style="display: flex;justify-content: space-around;align-content: center">
+            <div>
+                <div style="background-color: #262A2F;border-radius: 5px 0px 5px 0px;height: 40px;display: flex;flex-direction: column;justify-content: center">
+                    <span style="color: #FFFFFF;text-align: center">标准套餐</span>
                 </div>
-              </div>
+                <table>
+                    <tr style="height: 50px">
+                        <td rowspan="3" style="font-size: 16px; font-weight: 700">基础防护</td>
+                        <td class="biaozhun-taocan" data="300" fuwu="1"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            操作系统防护
+                        </td>
+                        <td>巡检+加固</td>
+                        <td>300</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td class="biaozhun-taocan" data="300" fuwu="2"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            中间件防护
+                        </td>
+                        <td>巡检+加固</td>
+                        <td>300</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td class="biaozhun-taocan" data="300" fuwu="3"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            服务应用防护
+                        </td>
+                        <td>巡检+加固</td>
+                        <td>300</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td rowspan="3" style="font-size: 16px; font-weight: 700">专业防护</td>
+                        <td class="biaozhun-taocan" data="700" fuwu="4"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            漏洞防护
+                        </td>
+                        <td>巡检+加固</td>
+                        <td>700</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td class="biaozhun-taocan" data="500" fuwu="5"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            木马防护
+                        </td>
+                        <td>实时巡检+加固</td>
+                        <td>500</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td class="biaozhun-taocan" data="600" fuwu="6"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            业务逻辑防护
+                        </td>
+                        <td>实时巡检+加固+合规</td>
+                        <td>600</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td rowspan="2" style="font-size: 16px; font-weight: 700">数据防护</td>
+                        <td class="biaozhun-taocan" data="400" fuwu="7"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            数据库防护
+                        </td>
+                        <td>巡检+加固</td>
+                        <td>400</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td class="biaozhun-taocan" data="800" fuwu="8"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png">
+                            数据安全防护
+                        </td>
+                        <td>数据安全审计/跨境数据合规检查/整改</td>
+                        <td>800</td>
+                    </tr>
+                    <tr style="height: 50px">
+                        <td rowspan="1" style="font-size: 16px; font-weight: 700">应急处理</td>
+                        <td class="biaozhun-taocan2" data="3000" fuwu="9"><img class="thumbnail_1" referrerpolicy="no-referrer" src="./images/unchoice.png"> 应急处理
+                        </td>
+                        <td>次</td>
+                        <td>3000</td>
+                    </tr>
+                </table>
             </div>
-
-            <div class="secure-content__right">
-              <img class="secure--content__right--image" src="./images/img2.png">
+            <div style="display: flex;flex-direction: column;justify-content: center;align-content: center">
+                <div class="modal-body">
+                    <span class="control-label" style="text-align: center;width: 100%;float: left">您选择了标准套餐，<span class="gongji">0</span>元/月</span>
+                    <span class="control-label" style="text-align: center;width: 100%;float: left">请留下您的联系方式，我们会尽快与您联系</span>
+                    <form id="myModal2_form" class="form-horizontal" role="form" onsubmit="return submit_myModal2_btn();">
+                        <div style="margin-top: 10px;width: 100%">
+                            <input type="text" class="form-control" name="name" placeholder="姓名" style="height: 45px;width: 100%"/>
+                        </div>
+                        <div style="margin-top: 10px;width: 100%">
+                            <input type="text" class="form-control big" name="telephone" placeholder="电话" style="height: 45px;width: 100%">
+                        </div>
+                        <div style="margin-top: 10px; margin-bottom: 10px;width: 100%">
+                            <input type="text" class="form-control big" name="companyName" placeholder="公司名称" style="height: 45px;width: 100%">
+                        </div>
+                        <button type="submit" style="background-color: rgba(21, 170, 125, 1);margin-left: 15px; width: 95%;display: block;font-size: 18px;border-radius: 6px;padding: 10px 16px">
+                            <span style="color: white">提交您的信息</span>
+                        </button>
+                    </form>
+                </div>
             </div>
-          </div>
-
-          <div class="secure-content--operate">
-            <div class="secure-content--operate__made">定制我的套餐</div>
-            <div class="secure-content--operate__connect" onclick="openPopup()">联系我们</div>
-          </div>
         </div>
-
-
-
-      </div>
-
-
-        <!-- 底部占位 -->
-        <div id="footer"></div>
-
-        <!-- 弹窗 -->
-        <div id="mask" class="mask"></div>
-        <div id="popup" class="secure-popup" style="display:none;">
-          <div class="secure-popup__close" onclick="closePopup()">
+    </div>
+    <!-- 弹窗: 联系我们 -->
+    <div id="mask" class="mask"></div>
+    <div id="popup" class="secure-popup" style="display:none;">
+        <div class="secure-popup__close" onclick="closePopup()">
             <img src="./images/close.png">
-          </div>
-          <div class="popup-content">
+        </div>
+        <div class="popup-content">
             <div class="popup-content__item">请留下您的联系方式，我们会尽快与您联系</div>
-            <div class="popup-content__item"><input class="input" type="text" placeholder="姓名" id="inputName" /></div>
-            <div class="popup-content__item"><input class="input" type="text" placeholder="电话" id="inputPhone" /></div>
-            <div class="popup-content__item"><input class="input" type="text" placeholder="公司名称" id="inputCompany" /></div>
+            <div class="popup-content__item"><input class="input" type="text" placeholder="姓名" id="inputName"/></div>
+            <div class="popup-content__item"><input class="input" type="text" placeholder="电话" id="inputPhone"/></div>
+            <div class="popup-content__item"><input class="input" type="text" placeholder="公司名称" id="inputCompany"/>
+            </div>
             <div class="popup-content__item popup-content__item2">
-              <input class="inputCode" type="text" placeholder="验证码" id="inputCode" />
-              <div class="codeImage"><img id="codeImg" onclick="changeCodeImg()" class="img" style="height: 56px"></div>
+                <input class="inputCode" type="text" placeholder="验证码" id="inputCode"/>
+                <div class="codeImage"><img id="codeImg" onclick="changeCodeImg()" class="img" style="height: 56px">
+                </div>
             </div>
             <div class="popup-content__btn" onclick="submitName()">提交</div>
-          </div>
         </div>
+    </div>
 
-      <div id="subpopup" class="secure-popup" style="display:none;">
+    <div id="subpopup" class="secure-popup" style="display:none;">
         <div class="secure-popup__close" onclick="closePopupsub()">
-          <img src="./images/close.png">
+            <img src="./images/close.png">
         </div>
         <div class="popup-content">
-          <div id="subpopupmessage" class="popup-content__item"></div>
-          <div class="popup-content__btn" id="subpopupmessageclose">关闭</div>
+            <div id="subpopupmessage" class="popup-content__item"></div>
+            <div class="popup-content__btn" id="subpopupmessageclose">关闭</div>
         </div>
-      </div>
-      </div>
     </div>
-  </body>
-  <script>
+</div>
+</div>
+</body>
+<style>
+    table,
+    td,
+    th {
+        text-align: center;
+        border: 1px solid #ddd;
+        border-collapse: collapse;
+    }
+    table td {
+        text-align: left;
+        padding-left: 5px;
+    }
+</style>
+<script>
+    var taocan = 0;
+    $('td.biaozhun-taocan').on('click', function(){
+        if (taocan == 0 || taocan == 2) {
+            $('td.biaozhun-taocan').find('img').attr('src', './images/unchoice.png');
+            taocan = 1;
+        }
+        $('td.biaozhun-taocan2').removeClass('on').addClass('off').find('img').attr('src', './images/FigmaDDSSlicePNGb036e0276b958fac7a72814f195c50b0.png');
+        if ($(this).hasClass('on')){
+            $(this).removeClass('on').addClass('off');
+            $(this).find('img').attr('src', './images/unchoice.png');
+        }else {
+            $(this).removeClass('off').addClass('on');
+            $(this).find('img').attr('src', './images/FigmaDDSSlicePNGba1504f367f579c6504830b2cee83a77.png');
+        }
+        var gongji = 0;
+        $('td.on').each(function(k,v){
+            gongji += parseInt($(v).attr('data'));
+        });
+        $('span.gongji').text(gongji);
+    });
+
+    $('td.biaozhun-taocan2').on('click', function(){
+        if (taocan == 0 || taocan == 1) {
+            $('td.biaozhun-taocan2').find('img').attr('src', './images/unchoice.png');
+            taocan = 2;
+        }
+        $('td.biaozhun-taocan').removeClass('on').addClass('off').find('img').attr('src', './images/FigmaDDSSlicePNGb036e0276b958fac7a72814f195c50b0.png');
+        if ($(this).hasClass('on')){
+            $(this).removeClass('on').addClass('off');
+            $(this).find('img').attr('src', './images/unchoice.png');
+        }else {
+            $(this).removeClass('off').addClass('on');
+            $(this).find('img').attr('src', './images/FigmaDDSSlicePNGba1504f367f579c6504830b2cee83a77.png');
+        }
+        var gongji = 0;
+        $('td.on').each(function(k,v){
+            gongji += parseInt($(v).attr('data'));
+        });
+        $('span.gongji').text(gongji);
+    });
+</script>
+<script>
+    function submit_myModal2_btn() {
+        var data = $('#myModal2_form').serialize();
+        var fuwu = '';
+        $('td.on').each(function(k,v){
+            if (fuwu) {
+                fuwu += ',';
+            }
+            fuwu += $(v).attr('fuwu');
+        });
+        data += '&fuwu=' + fuwu;
+        $.ajax({
+            url: 'http://aos.yyundong.com/ycsafe/business/buy/1',
+            type: "POST",
+            data: data,
+            success: function (result) {
+                if (result.result){
+                    alert("您的意向信息已提交，我们将尽快与您取得联系！");
+                    $('#myModal2').modal('hide');
+                    $('#myModal2_form').trigger('reset');
+
+                } else {
+                    alert(result.message);
+                }
+            }
+        });
+        return false;
+    }
+</script>
+<script>
+    function openPopuptc() {
+        document.getElementById("tcpopup").style.display = "block";
+    }
+
+    function closePopuptc() {
+        document.getElementById("tcpopup").style.display = "none";
+    }
+
+
     function openPopup() {
-      document.getElementById("popup").style.display = "block";
-      document.getElementById("mask").style.display = "block";
-      $('#codeImg').attr('src', './loulan/captcha/captchaImage?type=math&timestamp=' + Date.now());
+        document.getElementById("popup").style.display = "block";
+        document.getElementById("mask").style.display = "block";
+        $('#codeImg').attr('src', 'http://aos.yyundong.com/ycsafe/captcha/captchaImage?type=math&timestamp=' + Date.now());
     }
 
     function closePopup() {
-      document.getElementById("popup").style.display = "none";
-      document.getElementById("mask").style.display = "none";
+        document.getElementById("popup").style.display = "none";
+        document.getElementById("mask").style.display = "none";
     }
 
     // 提交名字函数
     function submitName() {
-      let name = $('#inputName').val();
-      let telephone = $('#inputPhone').val();
-      let companyName = $('#inputCompany').val();
-      let captcha = $('#inputCode').val();
+        let name = $('#inputName').val();
+        let telephone = $('#inputPhone').val();
+        let companyName = $('#inputCompany').val();
+        let captcha = $('#inputCode').val();
+
+        $("#inputName").blur(function () {
+            if (!name) {
+                $(this).removeClass("warning");
+            }
+        });
+        $("#inputPhone").blur(function () {
+            if (!telephone) {
+                $(this).removeClass("warning");
+            }
+        });
+        $("#inputCompany").blur(function () {
+            if (!companyName) {
+                $(this).removeClass("warning");
+            }
+        });
+        $("#inputCode").blur(function () {
+            if (!captcha) {
+                $(this).removeClass("warning");
+            }
+        });
 
-      $("#inputName").blur(function(){
-        if(!name){
-          $(this).removeClass("warning");
+        if (!name) {
+            document.getElementById("inputName").classList.add("warning");
+            document.getElementById("inputName").setAttribute("placeholder", "请输入您的姓名");
         }
-      });
-      $("#inputPhone").blur(function(){
-        if(!telephone){
-          $(this).removeClass("warning");
+        if (!telephone) {
+            document.getElementById("inputPhone").classList.add("warning");
+            document.getElementById("inputPhone").setAttribute("placeholder", "请输入您的电话");
         }
-      });
-      $("#inputCompany").blur(function(){
-        if(!companyName){
-          $(this).removeClass("warning");
+        if (!companyName) {
+            document.getElementById("inputCompany").classList.add("warning");
+            document.getElementById("inputCompany").setAttribute("placeholder", "请输入公司名称");
         }
-      });
-      $("#inputCode").blur(function(){
-        if(!captcha){
-          $(this).removeClass("warning");
+        if (!captcha) {
+            document.getElementById("inputCode").classList.add("warning");
+            document.getElementById("inputCode").setAttribute("placeholder", "请输入验证码");
+            return;
         }
-      });
 
-      if(!name){
-        document.getElementById("inputName").classList.add("warning");
-        document.getElementById("inputName").setAttribute("placeholder","请输入您的姓名");
-      }
-      if(!telephone){
-        document.getElementById("inputPhone").classList.add("warning");
-        document.getElementById("inputPhone").setAttribute("placeholder","请输入您的电话");
-      }
-      if(!companyName){
-        document.getElementById("inputCompany").classList.add("warning");
-        document.getElementById("inputCompany").setAttribute("placeholder","请输入公司名称");
-      }
-      if(!captcha){
-        document.getElementById("inputCode").classList.add("warning");
-        document.getElementById("inputCode").setAttribute("placeholder","请输入验证码");
-        return;
-      }
+        $.post('http://aos.yyundong.com/ycsafe//business/buy/9', {
+            'name': name,
+            'telephone': telephone,
+            'companyName': companyName,
+            'captcha': captcha
+        }, function (resp) {
 
-      $.post('/loulan/business/buy/9', {'name':name,'telephone':telephone,'companyName':companyName,'captcha':captcha}, function (resp){
-
-        if (!!resp && !!resp.result) {
-          alert('您的意向信息已提交，我们将尽快与您取得联系！');
-        } else {
-          alert(resp.message);
-        }
-      });
+            if (!!resp && !!resp.result) {
+                alert('您的意向信息已提交，我们将尽快与您取得联系！');
+            } else {
+                alert(resp.message);
+            }
+        });
     }
 
     function changeCodeImg() {
-      $('#codeImg').attr('src', './loulan/captcha/captchaImage?type=math&timestamp=' + Date.now());
+        $('#codeImg').attr('src', 'http://aos.yyundong.com/ycsafe/captcha/captchaImage?type=math&timestamp=' + Date.now());
     }
-  </script>
+</script>
 </html>
