[ Update ] :新增Banner 文字，以及各區塊背景設定，修正 element button hover 顏色

劉鈞霖

2021-11-15 0dd47f20adb82f7c6968d9c1077e91625f27bc69

[ Update ] :新增Banner 文字，以及各區塊背景設定，修正 element button hover 顏色

 PAMapp/assets/images/recommendConsultant/bg_flower_mob.svg

¤ñ¹ï·sÀÉ®×
@@ -0,0 +1,51 @@
<svg xmlns="http://www.w3.org/2000/svg" width="375.498" height="676.926" viewBox="0 0 375.498 676.926">

  <g id="bg_flower_mob" transform="translate(0.498)">

    <g id="Group_3287" data-name="Group 3287" transform="translate(0 599.957)" opacity="0.3">

      <path id="Path_8004" data-name="Path 8004" d="M56.023,83.684s0-2.976-3.224-1.736-9.921,7.193-9.673,13.145,1.862,9.266,1.8,10.586c0,0,7.873-4.385,9.609-6.369S56.767,87.652,56.023,83.684Z" transform="translate(-28.99 -81.646)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8005" data-name="Path 8005" d="M81.4,113.2s-2.977-2.729-5.209-.248-1.488,6.7.744,8.185,6.712,3.209,7.076,4.581c0,0,1.6-3.837,1.108-6.565S81.4,113.2,81.4,113.2Z" transform="translate(-73.716 -96.779)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8006" data-name="Path 8006" d="M41.211,141.761s5.457-.5,3.968,5.209a8.415,8.415,0,0,1-6.448,2.976c-4.216,0-7.282-4.485-9.345-5.467A29.214,29.214,0,0,1,41.211,141.761Z" transform="translate(-11.203 -111.698)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8007" data-name="Path 8007" d="M39.209,129.6a25.139,25.139,0,0,0,9.284-6.546,11.55,11.55,0,0,0,1.072-1.559.646.646,0,0,1-.145-.4c0-6.008-5.25-13.225-5.3-13.3a.651.651,0,0,1,1.05-.772c.209.284,4.749,6.526,5.46,12.543,4.1-7.952,10.27-24.775,10.344-24.978a.652.652,0,0,1,1.224.447c-.318.869-6.867,18.726-11.013,26.243,6.527-2.695,16.2-.281,16.643-.166a.652.652,0,1,1-.323,1.263c-.114-.029-11.5-2.876-17.393.919a.644.644,0,0,1-.222.089c-.142.2-.278.373-.409.524a25.994,25.994,0,0,1-9.828,6.92.652.652,0,0,1-.442-1.226Z" transform="translate(-38.779 -87.9)" fill="#f09491"/>

    </g>

    <g id="Group_3289" data-name="Group 3289" transform="translate(338 225.957)" opacity="0.3">

      <path id="Path_8004-2" data-name="Path 8004" d="M43.454,83.684s0-2.976,3.224-1.736S56.6,89.14,56.351,95.092s-1.863,9.266-1.8,10.586c0,0-7.873-4.385-9.609-6.369S42.71,87.652,43.454,83.684Z" transform="translate(-36.253 -81.645)" fill="#f09491"/>

      <path id="Path_8005-2" data-name="Path 8005" d="M78.663,113.2s2.977-2.729,5.209-.248,1.488,6.7-.744,8.185-6.712,3.209-7.077,4.581c0,0-1.6-3.837-1.108-6.565S78.663,113.2,78.663,113.2Z" transform="translate(-52.117 -96.779)" fill="#f09491"/>

      <path id="Path_8006-2" data-name="Path 8006" d="M33.612,141.761s-5.457-.5-3.968,5.209a8.415,8.415,0,0,0,6.448,2.976c4.216,0,7.282-4.485,9.345-5.467A29.214,29.214,0,0,0,33.612,141.761Z" transform="translate(-29.386 -111.698)" fill="#f09491"/>

      <path id="Path_8007-2" data-name="Path 8007" d="M67.887,129.6A25.139,25.139,0,0,1,58.6,123.05a11.549,11.549,0,0,1-1.072-1.559.646.646,0,0,0,.145-.4c0-6.008,5.251-13.225,5.3-13.3a.651.651,0,0,0-1.05-.772c-.209.284-4.749,6.526-5.46,12.543-4.1-7.952-10.27-24.775-10.344-24.978a.652.652,0,0,0-1.224.447c.318.869,6.867,18.726,11.013,26.243-6.527-2.695-16.2-.281-16.644-.166a.652.652,0,1,0,.323,1.263c.114-.029,11.5-2.876,17.393.919a.644.644,0,0,0,.222.089c.142.2.278.373.409.524a25.994,25.994,0,0,0,9.829,6.92.652.652,0,0,0,.442-1.226Z" transform="translate(-34.083 -87.9)" fill="#f09491"/>

    </g>

    <g id="Group_3306" data-name="Group 3306" transform="translate(35.834 82.17) rotate(112)" opacity="0.3">

      <path id="Path_8004-3" data-name="Path 8004" d="M51.9,83.033s0-2.025-2.194-1.181-6.751,4.895-6.583,8.945S44.391,97.1,44.349,98c0,0,5.358-2.984,6.539-4.334S52.407,85.733,51.9,83.033Z" transform="translate(-33.504 -81.646)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8005-3" data-name="Path 8005" d="M79.309,112.79s-2.026-1.857-3.545-.169a3.95,3.95,0,0,0,.506,5.57c1.519,1.013,4.568,2.183,4.816,3.117a9.883,9.883,0,0,0,.754-4.467C81.5,114.984,79.309,112.79,79.309,112.79Z" transform="translate(-74.077 -101.614)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8006-3" data-name="Path 8006" d="M37.434,141.758s3.713-.338,2.7,3.545a5.727,5.727,0,0,1-4.388,2.025c-2.869,0-4.956-3.052-6.36-3.72A19.881,19.881,0,0,1,37.434,141.758Z" transform="translate(-17.012 -121.299)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_8007-3" data-name="Path 8007" d="M39.072,118.273a17.108,17.108,0,0,0,6.319-4.454,7.859,7.859,0,0,0,.73-1.061.44.44,0,0,1-.1-.276c0-4.088-3.573-9-3.609-9.049a.443.443,0,0,1,.715-.525c.142.193,3.232,4.441,3.716,8.536,2.791-5.412,6.989-16.86,7.04-17a.443.443,0,0,1,.833.3c-.216.591-4.673,12.743-7.495,17.859,4.442-1.834,11.023-.191,11.327-.113a.443.443,0,1,1-.219.859c-.078-.02-7.825-1.957-11.837.626a.438.438,0,0,1-.151.061c-.1.134-.19.254-.278.356a17.69,17.69,0,0,1-6.689,4.709.442.442,0,0,1-.567-.267A.444.444,0,0,1,39.072,118.273Z" transform="translate(-38.779 -89.899)" fill="#f09491"/>

    </g>

    <g id="Group_3286" data-name="Group 3286" transform="translate(325.454 608.909)" opacity="0.3">

      <path id="Path_7987" data-name="Path 7987" d="M666.381,165.783a.75.75,0,0,1-.717-.531c-8.026-26.27-35.218-50.5-35.492-50.747a.75.75,0,0,1,.993-1.125c.277.244,27.783,24.754,35.934,51.433a.751.751,0,0,1-.718.969Z" transform="translate(-620.569 -97.766)" fill="#f09491"/>

      <path id="Path_7988" data-name="Path 7988" d="M642.559,84.88s-1.737-3.968,0-1.984,10.168,9.176,11.16,10.912.5,5.7-1.736,7.937-3.968,5.208-3.968,7.936a40.264,40.264,0,0,1-1.488-10.168C646.527,94.3,642.559,84.88,642.559,84.88Z" transform="translate(-626.504 -82.341)" fill="#f09491"/>

      <path id="Path_7989" data-name="Path 7989" d="M676.075,103.28s-.248-3.472.992-1.24,6.448,18.6,5.456,21.081-6.506,10.189-6.477,11.791c0,0-5.676-6.335-4.187-12.535S676.075,109.232,676.075,103.28Z" transform="translate(-641.415 -91.816)" fill="#f09491"/>

      <path id="Path_7990" data-name="Path 7990" d="M699.175,159.368s-.5-3.72.744-1.984,2.48,10.169,2.48,10.913.248,2.728-2.728,4.464a11.912,11.912,0,0,1-5.174,1.786,24.169,24.169,0,0,0,1.7-5.507C696.447,166.809,699.175,161.849,699.175,159.368Z" transform="translate(-652.859 -119.632)" fill="#f09491"/>

      <path id="Path_7991" data-name="Path 7991" d="M638.466,162.806s-4.464.992-2.233,2.729,7.441,4.96,12.153,1.984,6.562-4.367,6.562-4.367a6.858,6.858,0,0,0-5.074-1.834A62.621,62.621,0,0,0,638.466,162.806Z" transform="translate(-623.414 -121.829)" fill="#f09491"/>

      <path id="Path_7992" data-name="Path 7992" d="M663.037,198.035s-2.48-.992,0-1.488,8.929-1.736,11.409-.248a17.266,17.266,0,0,1,4.712,3.968c.248.5,2.48,1.736-.248,1.984s-7.688,1.488-9.177.5S663.037,198.035,663.037,198.035Z" transform="translate(-636.577 -138.966)" fill="#f09491"/>

      <path id="Path_7993" data-name="Path 7993" d="M613.627,126.838s-4.216,3.224-1.488,3.224,5.208.993,10.168,0,5.889-1.282,8.029-1.385c0,0-4.061-5.807-7.285-6.055S615.859,125.35,613.627,126.838Z" transform="translate(-611.22 -102.474)" fill="#f09491"/>

    </g>

    <g id="Group_3292" data-name="Group 3292" transform="matrix(0.799, -0.602, 0.602, 0.799, 4.976, 25.565)" opacity="0.3">

      <path id="Path_7987-2" data-name="Path 7987" d="M630.562,113.192a.643.643,0,0,1,.615.455c6.882,22.523,30.2,43.3,30.431,43.51a.643.643,0,0,1-.851.964c-.238-.21-23.82-21.224-30.81-44.1a.644.644,0,0,1,.615-.831Z" transform="translate(-627.361 -113.192)" fill="#f09491"/>

      <path id="Path_7988-2" data-name="Path 7988" d="M651.773,103.6s1.489,3.4,0,1.7-8.718-7.867-9.568-9.356-.425-4.891,1.488-6.8,3.4-4.465,3.4-6.8a34.522,34.522,0,0,1,1.276,8.718C648.371,95.524,651.773,103.6,651.773,103.6Z" transform="translate(-623.059 -47.465)" fill="#f09491"/>

      <path id="Path_7989-2" data-name="Path 7989" d="M677.246,128.412s.213,2.977-.851,1.063-5.528-15.948-4.678-18.075,5.578-8.736,5.553-10.109c0,0,4.866,5.432,3.59,10.747S677.246,123.309,677.246,128.412Z" transform="translate(-664.483 -79.925)" fill="#f09491"/>

      <path id="Path_7990-2" data-name="Path 7990" d="M697.266,169.937s.425,3.19-.638,1.7-2.126-8.718-2.126-9.356-.213-2.339,2.339-3.827a10.212,10.212,0,0,1,4.436-1.532,20.718,20.718,0,0,0-1.459,4.721C699.6,163.558,697.266,167.81,697.266,169.937Z" transform="translate(-694.497 -145.691)" fill="#f09491"/>

      <path id="Path_7991-2" data-name="Path 7991" d="M649.74,166.4s3.828-.851,1.914-2.339-6.38-4.253-10.42-1.7-5.626,3.744-5.626,3.744a5.88,5.88,0,0,0,4.35,1.572A53.692,53.692,0,0,0,649.74,166.4Z" transform="translate(-620.165 -143.215)" fill="#f09491"/>

      <path id="Path_7992-2" data-name="Path 7992" d="M676.7,199.956s2.126.851,0,1.276-7.655,1.488-9.782.213a14.805,14.805,0,0,1-4.04-3.4c-.213-.425-2.126-1.488.213-1.7s6.592-1.276,7.868-.425S676.7,199.956,676.7,199.956Z" transform="translate(-656.901 -192.285)" fill="#f09491"/>

      <path id="Path_7993-2" data-name="Path 7993" d="M625.546,125.75s3.615-2.764,1.276-2.764-4.465-.851-8.718,0-5.049,1.1-6.884,1.187c0,0,3.481,4.979,6.246,5.191S623.633,127.026,625.546,125.75Z" transform="translate(-585.13 -88.323)" fill="#f09491"/>

    </g>

    <g id="Group_3290" data-name="Group 3290" transform="translate(0 234.909)" opacity="0.3">

      <path id="Path_7987-3" data-name="Path 7987" d="M630.669,113.192a.75.75,0,0,1,.717.531c8.026,26.269,35.218,50.5,35.492,50.747a.75.75,0,0,1-.993,1.125c-.277-.245-27.783-24.754-35.934-51.433a.751.751,0,0,1,.718-.969Z" transform="translate(-626.935 -113.192)" fill="#f09491"/>

      <path id="Path_7988-3" data-name="Path 7988" d="M653.435,107.141s1.737,3.968,0,1.984-10.168-9.176-11.16-10.912-.5-5.7,1.736-7.936,3.968-5.208,3.968-7.936a40.264,40.264,0,0,1,1.488,10.168C649.467,97.717,653.435,107.141,653.435,107.141Z" transform="translate(-619.944 -41.665)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7989-3" data-name="Path 7989" d="M678.183,132.923s.248,3.472-.992,1.24-6.448-18.6-5.456-21.081,6.506-10.189,6.477-11.791c0,0,5.676,6.335,4.187,12.535S678.183,126.971,678.183,132.923Z" transform="translate(-663.298 -76.371)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7990-3" data-name="Path 7990" d="M697.726,172.1s.5,3.72-.744,1.984-2.48-10.168-2.48-10.912-.248-2.728,2.728-4.464a11.912,11.912,0,0,1,5.174-1.786,24.169,24.169,0,0,0-1.7,5.506C700.455,164.661,697.726,169.621,697.726,172.1Z" transform="translate(-694.497 -143.822)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7991-3" data-name="Path 7991" d="M652.09,167.243s4.464-.992,2.233-2.729-7.441-4.96-12.153-1.984-6.562,4.367-6.562,4.367a6.858,6.858,0,0,0,5.074,1.834A62.623,62.623,0,0,0,652.09,167.243Z" transform="translate(-617.596 -140.204)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7992-3" data-name="Path 7992" d="M679.15,200.682s2.48.992,0,1.488-8.929,1.736-11.409.248a17.266,17.266,0,0,1-4.712-3.968c-.248-.5-2.48-1.736.248-1.984s7.688-1.488,9.177-.5S679.15,200.682,679.15,200.682Z" transform="translate(-656.064 -191.735)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7993-3" data-name="Path 7993" d="M627.929,126.273s4.216-3.224,1.488-3.224-5.208-.993-10.168,0-5.889,1.282-8.029,1.385c0,0,4.061,5.807,7.285,6.055S625.7,127.761,627.929,126.273Z" transform="translate(-580.791 -82.621)" fill="none" stroke="#f09491" stroke-width="1"/>

    </g>

    <path id="Path_8014" data-name="Path 8014" d="M594.688,19.146A22.1,22.1,0,0,1,572.615-2.927,22.1,22.1,0,0,1,594.688-25,22.1,22.1,0,0,1,616.76-2.927,22.1,22.1,0,0,1,594.688,19.146Zm0-34.225A12.166,12.166,0,0,0,582.535-2.927,12.166,12.166,0,0,0,594.688,9.225,12.166,12.166,0,0,0,606.84-2.927,12.166,12.166,0,0,0,594.688-15.08Z" transform="translate(-288.308 537.626)" fill="none" stroke="#f09491" stroke-width="2" opacity="0.3"/>

    <path id="Path_8015" data-name="Path 8015" d="M594.688,19.146A22.1,22.1,0,0,1,572.615-2.927,22.1,22.1,0,0,1,594.688-25,22.1,22.1,0,0,1,616.76-2.927,22.1,22.1,0,0,1,594.688,19.146Zm0-34.225A12.166,12.166,0,0,0,582.535-2.927,12.166,12.166,0,0,0,594.688,9.225,12.166,12.166,0,0,0,606.84-2.927,12.166,12.166,0,0,0,594.688-15.08Z" transform="translate(-290.26 90.626)" fill="none" stroke="#f09491" stroke-width="2" opacity="0.3"/>

  </g>

</svg>


 PAMapp/assets/images/recommendConsultant/bg_flower_web.svg

¤ñ¹ï·sÀÉ®×
@@ -0,0 +1,46 @@
<svg id="bg_flower_web" xmlns="http://www.w3.org/2000/svg" width="1280" height="772.658" viewBox="0 0 1280 772.658">

  <g id="Group_3288" data-name="Group 3288" transform="translate(8.316 -28.896)">

    <g id="Group_3287" data-name="Group 3287" transform="translate(-8.316 696.946)" opacity="0.3">

      <path id="Path_8004" data-name="Path 8004" d="M65.9,85.244s0-5.255-5.693-3.065-17.517,12.7-17.079,23.209,3.289,16.361,3.177,18.691c0,0,13.9-7.743,16.967-11.246S67.216,92.252,65.9,85.244Z" transform="translate(-18.171 -81.645)" fill="#f09491"/>

      <path id="Path_8005" data-name="Path 8005" d="M86.424,114.19s-5.256-4.818-9.2-.439S74.6,125.575,78.541,128.2s11.851,5.665,12.495,8.088c0,0,2.832-6.774,1.956-11.591S86.424,114.19,86.424,114.19Z" transform="translate(-72.849 -85.191)" fill="#f09491"/>

      <path id="Path_8006" data-name="Path 8006" d="M50.266,141.769s9.635-.876,7.006,9.2a14.858,14.858,0,0,1-11.385,5.255c-7.444,0-12.858-7.919-16.5-9.652A51.583,51.583,0,0,1,50.266,141.769Z" transform="translate(2.721 -88.686)" fill="#f09491"/>

      <path id="Path_8007" data-name="Path 8007" d="M39.539,156.733a44.388,44.388,0,0,0,16.394-11.557,20.394,20.394,0,0,0,1.893-2.752,1.141,1.141,0,0,1-.255-.715c0-10.607-9.271-23.351-9.364-23.479a1.15,1.15,0,0,1,1.854-1.362c.369.5,8.385,11.522,9.641,22.146,7.24-14.041,18.134-43.745,18.264-44.1a1.151,1.151,0,0,1,2.161.79C79.565,97.235,68,128.765,60.681,142.038c11.524-4.759,28.6-.5,29.387-.294a1.15,1.15,0,1,1-.569,2.229c-.2-.051-20.3-5.077-30.711,1.624a1.137,1.137,0,0,1-.393.157c-.251.347-.492.659-.721.924A45.9,45.9,0,0,1,40.319,158.9a1.147,1.147,0,0,1-1.472-.692A1.152,1.152,0,0,1,39.539,156.733Z" transform="translate(-38.779 -83.111)" fill="#f09491"/>

    </g>

    <g id="Group_3289" data-name="Group 3289" transform="translate(1203.506 273.133)" opacity="0.3">

      <path id="Path_8004-2" data-name="Path 8004" d="M43.786,85.7s0-5.927,6.421-3.457S69.964,96.572,69.47,108.425s-3.709,18.454-3.584,21.081c0,0-15.679-8.733-19.137-12.684S42.3,93.608,43.786,85.7Z" transform="translate(-29.445 -81.645)" fill="#f09491"/>

      <path id="Path_8005-2" data-name="Path 8005" d="M82.446,114.481s5.928-5.434,10.373-.495,2.963,13.336-1.482,16.3-13.367,6.39-14.093,9.122c0,0-3.194-7.64-2.207-13.073S82.446,114.481,82.446,114.481Z" transform="translate(-29.579 -81.773)" fill="#f09491"/>

      <path id="Path_8006-2" data-name="Path 8006" d="M37.8,141.772s-10.867-.988-7.9,10.373a16.758,16.758,0,0,0,12.841,5.927c8.4,0,14.5-8.932,18.611-10.887A58.179,58.179,0,0,0,37.8,141.772Z" transform="translate(-29.387 -81.9)" fill="#f09491"/>

      <path id="Path_8007-2" data-name="Path 8007" d="M96.747,164.736A50.065,50.065,0,0,1,78.257,151.7a23.006,23.006,0,0,1-2.135-3.1,1.287,1.287,0,0,0,.288-.807c0-11.964,10.456-26.337,10.562-26.481a1.3,1.3,0,0,0-2.091-1.536c-.416.566-9.458,13-10.874,24.979-8.166-15.837-20.453-49.339-20.6-49.743a1.3,1.3,0,0,0-2.438.891c.633,1.731,13.676,37.292,21.933,52.264-13-5.367-32.257-.559-33.146-.332a1.3,1.3,0,1,0,.642,2.514c.228-.058,22.9-5.727,34.638,1.831a1.282,1.282,0,0,0,.443.177c.283.391.555.743.814,1.043a51.767,51.767,0,0,0,19.574,13.781,1.3,1.3,0,0,0,.88-2.442Z" transform="translate(-29.426 -81.698)" fill="#f09491"/>

    </g>

    <g id="Group_3286" data-name="Group 3286" transform="translate(1164.133 678.689)" opacity="0.3">

      <path id="Path_7987" data-name="Path 7987" d="M695.785,208.191a1.355,1.355,0,0,1-1.3-.959c-14.5-47.453-63.619-91.232-64.114-91.669a1.355,1.355,0,0,1,1.794-2.031c.5.442,50.186,44.716,64.911,92.909a1.356,1.356,0,0,1-1.3,1.751Z" transform="translate(-613.03 -85.327)" fill="#f09491"/>

      <path id="Path_7988" data-name="Path 7988" d="M643.182,86.928s-3.137-7.169,0-3.584,18.367,16.576,20.159,19.711.9,10.3-3.136,14.336-7.168,9.408-7.168,14.336a72.734,72.734,0,0,1-2.688-18.367C650.349,103.952,643.182,86.928,643.182,86.928Z" transform="translate(-614.179 -82.341)" fill="#f09491"/>

      <path id="Path_7989" data-name="Path 7989" d="M679.676,104.883s-.448-6.272,1.792-2.24,11.648,33.6,9.856,38.081-11.752,18.406-11.7,21.3c0,0-10.252-11.444-7.563-22.643S679.676,115.636,679.676,104.883Z" transform="translate(-617.066 -84.175)" fill="#f09491"/>

      <path id="Path_7990" data-name="Path 7990" d="M702.947,161.34s-.9-6.72,1.344-3.584,4.48,18.368,4.48,19.712.448,4.928-4.928,8.064-9.346,3.227-9.346,3.227,2.626-5.915,3.073-9.947S702.947,165.821,702.947,161.34Z" transform="translate(-619.281 -89.56)" fill="#f09491"/>

      <path id="Path_7991" data-name="Path 7991" d="M640.77,164.006s-8.065,1.793-4.033,4.929,13.441,8.96,21.952,3.584,11.854-7.888,11.854-7.888-2.893-3.313-9.166-3.313S647.49,162.662,640.77,164.006Z" transform="translate(-613.581 -89.986)" fill="#f09491"/>

      <path id="Path_7992" data-name="Path 7992" d="M663.926,200.007s-4.48-1.792,0-2.688,16.128-3.136,20.608-.448,8.065,6.272,8.513,7.168,4.48,3.136-.448,3.584-13.888,2.688-16.576.9S663.926,200.007,663.926,200.007Z" transform="translate(-616.129 -93.303)" fill="#f09491"/>

      <path id="Path_7993" data-name="Path 7993" d="M615.568,130.25s-7.617,5.824-2.688,5.824,9.408,1.793,18.367,0,10.638-2.316,14.5-2.5c0,0-7.335-10.49-13.16-10.938S619.6,127.562,615.568,130.25Z" transform="translate(-611.22 -86.238)" fill="#f09491"/>

    </g>

    <g id="Group_3292" data-name="Group 3292" transform="matrix(0.799, -0.602, 0.602, 0.799, -8.316, 73.675)" opacity="0.3">

      <path id="Path_7987-2" data-name="Path 7987" d="M1.127,0A1.127,1.127,0,0,1,2.2.8c12.054,39.451,52.891,75.848,53.3,76.211A1.126,1.126,0,0,1,54.015,78.7C53.6,78.33,12.291,41.522.049,1.456A1.128,1.128,0,0,1,1.127,0Z" transform="translate(4.48 0)" fill="#f09491"/>

      <path id="Path_7988-2" data-name="Path 7988" d="M17.492,37.245s2.608,5.96,0,2.98S2.221,26.444.732,23.837-.013,15.27,3.339,11.918,9.3,4.1,9.3,0a60.468,60.468,0,0,1,2.235,15.27C11.533,23.092,17.492,37.245,17.492,37.245Z" transform="translate(32.804 61.087)" fill="#f09491"/>

      <path id="Path_7989-2" data-name="Path 7989" d="M9.871,47.5s.372,5.214-1.49,1.862S-1.3,21.432.187,17.708,9.958,2.405,9.915,0c0,0,8.523,9.514,6.288,18.825S9.871,38.565,9.871,47.5Z" transform="translate(12.484 37.425)" fill="#f09491"/>

      <path id="Path_7990-2" data-name="Path 7990" d="M4.849,22.8s.745,5.587-1.117,2.98S.008,10.5.008,9.387s-.372-4.1,4.1-6.7A17.888,17.888,0,0,1,11.875,0,36.3,36.3,0,0,0,9.32,8.27C8.947,11.622,4.849,19.07,4.849,22.8Z" transform="translate(0 19.674)" fill="#f09491"/>

      <path id="Path_7991-2" data-name="Path 7991" d="M24.753,8.9s6.7-1.491,3.353-4.1S16.931-2.648,9.855,1.821,0,8.379,0,8.379s2.405,2.754,7.62,2.754S19.166,10.015,24.753,8.9Z" transform="translate(27.05 31.71)" fill="#f09491"/>

      <path id="Path_7992-2" data-name="Path 7992" d="M25.855,7.646s3.724,1.49,0,2.235-13.409,2.607-17.133.372-6.7-5.214-7.077-5.959-3.725-2.607.372-2.98S13.563-.92,15.8.569,25.855,7.646,25.855,7.646Z" transform="translate(8.816 5.79)" fill="#f09491"/>

      <path id="Path_7993-2" data-name="Path 7993" d="M25.094,5.5S31.426.662,27.328.662s-7.821-1.491-15.27,0S3.214,2.588,0,2.742c0,0,6.1,8.721,10.941,9.093S21.742,7.739,25.094,5.5Z" transform="translate(45.699 60.052)" fill="#f09491"/>

    </g>

    <g id="Group_3290" data-name="Group 3290" transform="translate(0.683 269.487)" opacity="0.3">

      <path id="Path_7987-3" data-name="Path 7987" d="M630.87,113.192a.952.952,0,0,1,.909.673c10.179,33.315,44.664,64.051,45.012,64.358a.951.951,0,0,1-1.259,1.426c-.351-.31-35.234-31.393-45.572-65.228a.952.952,0,0,1,.91-1.23Z" transform="translate(-626.135 -113.192)" fill="#f09491"/>

      <path id="Path_7988-3" data-name="Path 7988" d="M656.558,113.793s2.2,5.033,0,2.516-12.9-11.637-14.153-13.839-.629-7.234,2.2-10.065,5.032-6.6,5.032-10.064a51.063,51.063,0,0,1,1.887,12.9C651.526,101.841,656.558,113.793,656.558,113.793Z" transform="translate(-614.086 -30.755)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7989-3" data-name="Path 7989" d="M679.946,141.407s.315,4.4-1.258,1.573-8.177-23.59-6.919-26.735,8.251-12.922,8.214-14.953c0,0,7.2,8.034,5.31,15.9S679.946,133.858,679.946,141.407Z" transform="translate(-661.068 -69.687)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7990-3" data-name="Path 7990" d="M698.592,176.173s.629,4.718-.943,2.516-3.145-12.9-3.145-13.839-.314-3.46,3.46-5.661a15.106,15.106,0,0,1,6.562-2.266,30.651,30.651,0,0,0-2.158,6.983C702.052,166.737,698.592,173.027,698.592,176.173Z" transform="translate(-694.497 -140.309)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7991-3" data-name="Path 7991" d="M656.511,168.832s5.662-1.259,2.831-3.46-9.436-6.29-15.412-2.516-8.322,5.538-8.322,5.538,2.031,2.326,6.435,2.326A79.418,79.418,0,0,0,656.511,168.832Z" transform="translate(-612.765 -134.54)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7992-3" data-name="Path 7992" d="M683.768,202.047s3.145,1.258,0,1.887-11.323,2.2-14.468.315a21.9,21.9,0,0,1-5.976-5.032c-.314-.629-3.145-2.2.315-2.516s9.751-1.887,11.638-.629S683.768,202.047,683.768,202.047Z" transform="translate(-654.49 -190.701)" fill="none" stroke="#f09491" stroke-width="1"/>

      <path id="Path_7993-3" data-name="Path 7993" d="M632.411,127.256s5.347-4.089,1.887-4.089-6.6-1.259-12.9,0-7.469,1.626-10.182,1.756c0,0,5.15,7.364,9.239,7.679S629.58,129.143,632.411,127.256Z" transform="translate(-572.629 -71.896)" fill="none" stroke="#f09491" stroke-width="1"/>

    </g>

    <path id="Path_8014" data-name="Path 8014" d="M600.608,30.986A28.024,28.024,0,0,1,572.615,2.993a27.993,27.993,0,1,1,55.986,0A28.024,28.024,0,0,1,600.608,30.986Zm0-43.4A15.43,15.43,0,0,0,585.2,2.993a15.412,15.412,0,0,0,30.824,0A15.429,15.429,0,0,0,600.608-12.419Z" transform="translate(566 589.689)" fill="none" stroke="#f09491" stroke-width="2" opacity="0.3"/>

    <path id="Path_8016" data-name="Path 8016" d="M600.608,30.986A28.024,28.024,0,0,1,572.615,2.993a27.993,27.993,0,1,1,55.986,0A28.024,28.024,0,0,1,600.608,30.986Zm0-43.4A15.43,15.43,0,0,0,585.2,2.993a15.412,15.412,0,0,0,30.824,0A15.429,15.429,0,0,0,600.608-12.419Z" transform="translate(-520.483 454.689)" fill="none" stroke="#f09491" stroke-width="2" opacity="0.3"/>

    <path id="Path_8015" data-name="Path 8015" d="M616.657,63.085A44.043,44.043,0,1,1,660.7,19.043,44.091,44.091,0,0,1,616.657,63.085Zm0-68.29a24.248,24.248,0,1,0,24.248,24.248A24.276,24.276,0,0,0,616.657-5.205Z" transform="translate(531.424 65.8)" fill="none" stroke="#f09491" stroke-width="2" opacity="0.3"/>

  </g>

</svg>


 PAMapp/assets/scss/utilities/_utilities.scss

@@ -16,6 +16,9 @@
.mt-10 {
  margin-top: 10px;
}
.mt-5 {
  margin-top: 5px;
}

.mb-10 {
  margin-bottom: 10px;

 PAMapp/assets/scss/vendors/elementUI/_button.scss

@@ -20,6 +20,10 @@
    color: $PRIMARY_WHITE;
    background-color: $MID_GREY;
    border-color: $MID_GREY;
    &:hover{
      background-color: $MID_GREY;
      border-color: $MID_GREY;
    }
  }
}


 PAMapp/layouts/default.vue

@@ -1,95 +1,189 @@
<template>
    <div class="pam-background">
        <UiGoToTop></UiGoToTop>
        <BackActionBar></BackActionBar>
        <div class="banner" :class="bannerClassName"></div>
        <Nuxt class="page-container"></Nuxt>
        <Footer ref="defaultLayoutFooter"></Footer>
  <div class="pam-background">
    <UiGoToTop></UiGoToTop>
    <BackActionBar></BackActionBar>
    <div class="pam-banner"
      :class="bannerClassName">
      <div class="pam-banner__text text--dark-blue">
        <div class="mt-5"
          v-for="(item,index) in getBannerTextList"
          :key="index">
          {{item}}
        </div>
      </div>
    </div>
    <div class="pam-container" :class="containClassName">
      <Nuxt class="pam-page-container"></Nuxt>
    </div>
    <Footer></Footer>
  </div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
  import { Vue, Component } from 'vue-property-decorator';
  import * as _ from 'lodash';

@Component
export default class DefaultLayout extends Vue {
  pageHieght = '';

  get bannerClassName() {
    if (this.$route.name) {
      return this.noBanner(this.$route.name) ? 'noBanner' : this.$route.name.split('-')[0]
    } else {
      return '';
  @Component
  export default class DefaultLayout extends Vue {
    private bannerTextDto:BannerDto= {
      [RouterPage.RECOMMEND_CONSULTANT]: ['輸入問題回答', '依照你的需求推薦嚴選顧問'],
      [RouterPage.QUICK_FILTER]: ['點選下方選項', '尋找你的BEST Match'],
      [RouterPage.MY_CONSULTANT_LIST]:[],
      [RouterPage.QUESTIONNAIRE]:[],
    }
  }
    get getBannerTextList(): string[] {
      return this.bannerTextDto[this.route] ? this.bannerTextDto[this.route] : [];
    };

  noBanner(routerName : string) {
    return routerName.match('questionnaire') || routerName.match('agentInfo');
  }
    get route(): string {
      return _.split(this.$route.name, '-')[0];
    };

}
    get bannerClassName() {
      return this.route ? this.routeFormatBannerClass(this.route) : '';
    };

    // format to {page}-banner or pam-no-banner tag
    private routeFormatBannerClass(route: string): string {
      const needBannerTags = ['recommendConsultant', 'quickFilter', 'myConsultantList'];
      return _.includes(needBannerTags, route) ? route + '-banner' : 'pam-no-banner';
    };

    get containClassName(): string {
      return this.routeFormatContainClass(this.route);
    };

    // format to {page}-container tag
    private routeFormatContainClass(route: string): string {
      const needContainBgTags = ['recommendConsultant', 'questionnaire'];
      return _.includes(needContainBgTags, route) ? route + '-container' : '';
    };
  }
  enum RouterPage {
    RECOMMEND_CONSULTANT = 'recommendConsultant',
    QUICK_FILTER = "quickFilter",
    MY_CONSULTANT_LIST = "myConsultantList",
    QUESTIONNAIRE = 'questionnaire',
  }
  type BannerDto={
    [x:string]:string[];
  };
</script>

<style lang="scss" scoped>
<style lang="scss"
  scoped>
  .pam-background {
    background-color: #F8F9FA;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    .page-container {
    .pam-container{
      flex: 1;
    }
  }

  .page-container {
    padding: 30px 40px;
  .pam-page-container {
    margin: 30px 20px;
  }

  @include desktop {
    .page-container{
    .pam-page-container {
      width: 700px;
      margin: 0 auto;
      margin: 30px auto 0px auto;
      overflow-x: hidden;
    }
    .pam-banner__text{
      width: 700px;
      position: static !important;
      margin: 30px auto 0px auto;
    }
  }

  .banner {
  .pam-banner {
    width: 100%;
    height: 120px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
  }

  .noBanner {
  .pam-banner__text {
    font-size: 18px;
    font-weight: bold;
    position: absolute;
    bottom: 15px;
    left: 25px;

    div:first-child {
      margin: 0px;
    }
  }

  .pam-no-banner {
    display: none;
  }

  // page
  .quickFilter {
    background-image: url('~/assets/images/quickFilter/banner_mob.svg');
    &-banner {
      background-image: url('~/assets/images/quickFilter/banner_mob.svg');
    }

    @media (min-width: 768px) {
      &-banner {
        background-image: url('~/assets/images/quickFilter/banner_web.svg');
      }
    }
  }

  .recommendConsultant {
    background-image: url('~/assets/images/recommendConsultant/banner_mob.svg');
    &-banner {
      background-image: url('~/assets/images/recommendConsultant/banner_mob.svg');
      background-size: cover;
    }

    &-container {
      background-image: url('~/assets/images/recommendConsultant/bg_flower_mob.svg');
      background-size: contain;
    }

    @media (min-width: 768px) {
      &-banner {
        background-image: url('~/assets/images/recommendConsultant/banner_web.svg');
        background-size: cover;
      }

      &-container {
        background-image: url('~/assets/images/recommendConsultant/bg_flower_web.svg');
        background-size: cover;
      }
    }
  }

  .myConsultantList {
    background-image: url('~/assets/images/myConsultantList/banner_mob.svg');
  }

  @media (min-width: 768px) {

    .quickFilter {
      background-image: url('~/assets/images/quickFilter/banner_web.svg');
    &-banner {
      background-image: url('~/assets/images/myConsultantList/banner_mob.svg');
    }

    .recommendConsultant {
      background-image: url('~/assets/images/recommendConsultant/banner_web.svg');
    }

    .myConsultantList {
      background-image: url('~/assets/images/myConsultantList/banner_web.svg');
    @media (min-width: 768px) {
      &-banner {
        background-image: url('~/assets/images/myConsultantList/banner_web.svg');
      }
    }
  }

  .questionnaire {
    &-container {
      background-image: url('~/assets/images/recommendConsultant/bg_flower_mob.svg');
      background-size: contain;
    }

    @media (min-width: 768px) {
      &-container {
        background-image: url('~/assets/images/recommendConsultant/bg_flower_web.svg');
        background-size: cover;
      }
    }
  }
</style>

 PAMapp/pages/consultantLogin/index.vue

@@ -1,118 +1,140 @@
<template>
    <div>
      <div class="pam-consultant-login">
        <div class="pam-consultant-login__header mt-30">顧問登入</div>
        <div class="pam-consultant-login__title mt-30">帳號</div>
  <div>
    <div class="pam-consultant-login">
      <div class="pam-consultant-login__header pam-paragraph">顧問登入</div>
      <div class="pam-paragraph">
        <div class="pam-consultant-login__title">帳號</div>
        <div class="position-r mt-10">
          <input type="text"
            :model="loginDto.account"
            class="pam-consultant-login__input"
            placeholder="輸入eService帳號">
          <div class="pam-consultant-login__inputIcon text--primary cursor--pointer" @click="cookieAccount">
              <i :class="[isRemember ? 'icon-checkbox-1' : 'icon-checkbox','pr-5']"></i>
              è¨˜ä½
          <div class="pam-consultant-login__inputIcon text--primary cursor--pointer"
            @click="cookieAccount">
            <i :class="[isRemember ? 'icon-checkbox-1' : 'icon-checkbox','pr-5']"></i>
            è¨˜ä½
          </div>
        </div>
        <div class="pam-consultant-login__title mt-30">
           <div>密碼</div>
           <div class="text--primary fs-16 cursor--pointer" @click="forgetPassword">忘記密碼？</div>
         </div>
      </div>
      <div class="pam-paragraph">
        <div class="pam-consultant-login__title ">
          <div>密碼</div>
          <div class="text--primary fs-16 cursor--pointer"
            @click="forgetPassword">忘記密碼？</div>
        </div>
        <div class="position-r mt-10">
          <input :type="[isShowPassword ? 'text' : 'password']"
            :model="loginDto.password"
            class="pam-consultant-login__input"
            placeholder="輸入eService密碼">
          <div class="pam-consultant-login__inputIcon cursor--pointer" @click="isShowPassword = !isShowPassword">
          <div class="pam-consultant-login__inputIcon cursor--pointer"
            @click="isShowPassword = !isShowPassword">
            <i :class="[isShowPassword ? 'icon-eye-1 fs-25' : 'icon-eye' , 'text--primary']"></i>
          </div>
        </div>
        <div class="pam-consultant-login__title mt-30">
           <div>驗證碼</div>
           <div class="text--dark-blue fs-16 cursor--pointer" @click="regenerateCode">重新產生</div>
         </div>
      </div>
      <div class="pam-paragraph">
        <div class="pam-consultant-login__title">
          <div>驗證碼</div>
          <div class="text--dark-blue fs-16 cursor--pointer"
            @click="regenerateCode">重新產生</div>
        </div>
        <div class="pam-consultant-login__verifyBlock mt-10">
          <div class="w-55">
            <input type="text"
              :modal="loginDto.verificationCode"
              class="pam-consultant-login__input" >
              class="pam-consultant-login__input">
          </div>
          <div class="pam-consultant-login__verifyImg"></div>
        </div>
        <div class="pam-consultant-login__confirmBlock mt-30">
           <button class="pam-consultant-login__confirm cursor--pointer" @click="login">送出</button>
        </div>
      </div>
      <div class="pam-consultant-login__confirmBlock pam-paragraph">
        <button class="pam-consultant-login__confirm cursor--pointer"
          @click="login">送出</button>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
  import {
    Vue,
    Component
  } from 'vue-property-decorator';

@Component({
  layout:'home'
})
export default class ConsultantLogin extends Vue {
  isRemember=false;
  isShowPassword=false;
  loginDto={
    account:'',
    password:'',
    verificationCode:'',
  }
  @Component({
    layout: 'default'
  })
  export default class ConsultantLogin extends Vue {
    isRemember = false;
    isShowPassword = false;
    loginDto = {
      account: '',
      password: '',
      verificationCode: '',
    }


  login():void{
    console.log('login');
  }
    login(): void {
      console.log('login');
    }

  cookieAccount():void{
    this.isRemember = !this.isRemember;
    if(this.isRemember){
      console.log('sotre account');
    cookieAccount(): void {
      this.isRemember = !this.isRemember;
      if (this.isRemember) {
        console.log('sotre account');
      }
    }

    forgetPassword(): void {
      console.log('forget password');
    }

    regenerateCode(): void {
      console.log('call api regenerate verificationCode')
    }
  }

  forgetPassword():void{
    console.log('forget password');
  }

  regenerateCode():void{
    console.log('call api regenerate verificationCode')
  }
}
</script>
<style lang="scss" scoped>
  .mt-20{
<style lang="scss"
  scoped>
  .mt-20 {
    margin-top: 20px;
  }
  .mt-25{

  .mt-25 {
    margin-top: 25px;
  }
  .w-55{

  .w-55 {
    width: 55% !important;
  }
  .position-r{

  .position-r {
    position: relative;
  }
  .pam-consultant-login{

  .pam-consultant-login {
    margin: auto;
    width: 336px;
    margin: 40px auto 30px auto;
    font-size: 20px;
    color: $PRIMARY_BLACK;
    &__header{

    &__header {
      text-align: center;
      font-size: 24px;
      font-weight: bold;
      letter-spacing: 1.2;
      color: $PRIMARY_BLACK;
    }
    &__title{
      display:flex;

    &__title {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0px 10px;
    }
    &__input{

    &__input {
      width: 100%;
      outline: 0;
      border: 1px solid #CCCCCC;
@@ -125,7 +147,7 @@
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;

      &Icon{
      &Icon {
        position: absolute;
        display: flex;
        align-items: center;
@@ -133,25 +155,29 @@
        right: 15px;
      }
    }
    &__verifyBlock{

    &__verifyBlock {
      display: flex;
      justify-content: space-between;
    }
    &__verifyImg{
      width:126px;
      border:1px black solid;

    &__verifyImg {
      width: 126px;
      border: 1px black solid;
    }
    &__confirmBlock{

    &__confirmBlock {
      display: flex;
      justify-content: center;
    }
    &__confirm{

    &__confirm {
      color: $PRIMARY_WHITE;
      width: 80px;
      height: 50px;
      border-radius: 30px;
      border: 1px solid $LIGHT_GREY;
      background-color:$PRIMARY_RED;
      background-color: $PRIMARY_RED;
    }
  }


 PAMapp/pages/questionnaire/_agentNo.vue

@@ -1,5 +1,5 @@
<template>
    <div class="pam-page">
    <div>
        <div class="pb-18">
            <span class="mdTxt  required">請問您希望保險顧問以電話或Email聯繫您呢?</span>
            <span class="hint">可複選</span>
@@ -63,7 +63,7 @@
            <i class="icon-down down-icon " style="margin-right:18px" @click="showJobDrawer = true" ></i>
        </div>
        
        <div class="ques-footer pt-30">
        <div class="ques-footer pam-paragraph">
            <el-button type="primary"
            :disabled=" isInitScheduleDisabled || !isSelected" 
            @click="sentDemand">送出</el-button>

 PAMapp/pages/quickFilter/index.vue

@@ -44,7 +44,7 @@
            <span class="mdTxt">快速篩選推薦</span>
            <span class="smTxt_bold text--prudential_grey ml-10">共 {{consultantList.length}} ç­†</span>
        </div>
        <div class="recommend">
        <div class="recommend pam-paragraph">
            <img class="img" src="~/assets/images/quickFilter/recommend.svg" alt="">

            <template v-if="consultantList.length > 0">

 PAMapp/pages/recommendConsultant/index.vue

@@ -1,8 +1,8 @@
<template>
  <div class="pam-page">
  <div>
    <div class="pb-10 mdTxt">您的性別</div>
    <SingleSelectBtn :singleSelected.sync="strictQueryDto.gender" :options="genderOptions"/>
    <div class="mt-30">
    <div class="pam-paragraph">
      <div class="pb-10 mdTxt required">所在地區</div>
      <div class="job-pick cursor--pointer"
        @click="showAddress = true">
@@ -17,27 +17,27 @@
          @change="area => strictQueryDto.area = area" />
      </PopUpFrame>
    </div>
    <div class="mt-30">
      <div class="pb-10 mdTxt required" @click="showDialog = true">
    <div class="pam-paragraph">
      <div class="pb-10 mdTxt required">
        æƒ³è¦è©¢å•çš„問題
        <span class="hint text--bold">
          <i class="icon-information text--bold"></i>可複選
          <i class="icon-information text--bold" @click="showDialog = true"></i>可複選
        </span>
      </div>
      <MultiSelectBtn :mutiSelect.sync="strictQueryDto.requirements" :options="requirementOptions" />
    </div>
    <div class="mt-30 pam-tags">
    <div class="pam-paragraph pam-tags">
      <div class="pb-10 mdTxt">顧問年資</div>
       <SingleSelectBtn :singleSelected.sync="strictQueryDto.seniority" :options="seniorityOptions"/>
    </div>
    <div class="rate-consultant mt-30">
    <div class="rate-consultant pam-paragraph">
      <div class="pb-10 mdTxt">保險顧問滿意度</div>
      <el-rate v-model="strictQueryDto.avgScore"
        :colors="elRateColors"
        class="rate">
      </el-rate>
    </div>
    <div class="mt-30">
    <div class="pam-paragraph">
      <div class="rec-popular">
        <div class="pb-10 mdTxt">熱門檢索</div>
        <div class="hint text--bold ml-10">可複選</div>
@@ -46,7 +46,7 @@
        :options="popularOptions"
        :nameOfOtherOption="'#其他'" :otherSelect.sync="strictQueryDto.otherPopularTags" />
    </div>
    <div class="rec-footer mt-30">
    <div class="rec-footer pam-paragraph">
      <el-button type="primary"
        :disabled="notFinishByRequireRules"
        @click="makePair">馬上配對</el-button>
@@ -111,6 +111,10 @@
      },
      {
        title:'子女教育',
        label:'子女教育',
      },
      {
        title:'資產規劃',
        label:'資產規劃',
      },
      {
@@ -122,8 +126,8 @@
        label:'保單健檢/規劃',
      },
      {
        title:'防疫保單相關',
        label:'防疫保單相關',
        title:'分紅保單相關',
        label:'分紅保單相關',
      },
    ];
    seniorityOptions=[
@@ -288,7 +292,6 @@
  .el-drawer__container ::-webkit-scrollbar {
    display: none;
  }

  .el-button+.el-button {
    margin-left: 0;
  }