diff --git a/components/summon/SummonGrid/index.scss b/components/summon/SummonGrid/index.scss
index 830cfee2..5f575ff9 100644
--- a/components/summon/SummonGrid/index.scss
+++ b/components/summon/SummonGrid/index.scss
@@ -1,6 +1,6 @@
 #SummonGrid {
   display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr)) 2fr;
+  grid-template-columns: 1.17fr 2fr 1.17fr;
   gap: $unit-3x;
   justify-content: center;
   margin: 0 auto;
diff --git a/components/summon/SummonGrid/index.tsx b/components/summon/SummonGrid/index.tsx
index 75f2b089..3a72028b 100644
--- a/components/summon/SummonGrid/index.tsx
+++ b/components/summon/SummonGrid/index.tsx
@@ -452,8 +452,8 @@ const SummonGrid = (props: Props) => {
     <div>
       <div id="SummonGrid">
         {mainSummonElement}
-        {friendSummonElement}
         {summonGridElement}
+        {friendSummonElement}
       </div>
 
       {subAuraSummonElement}