diff --git a/src/lib/DamageCalculator.svelte b/src/lib/DamageCalculator.svelte
index db081e4..8c6daf3 100644
--- a/src/lib/DamageCalculator.svelte
+++ b/src/lib/DamageCalculator.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import { invoke } from "@tauri-apps/api/tauri";
   import AutoComplete from "simple-svelte-autocomplete";
-  import attack_types from "../const/attack_types.json"
+  import attack_types from "../const/attack_types.json";
 
   export let player1Data;
   export let player2Data;
@@ -18,6 +18,8 @@
   let attack_direction = "p1p2";
   let total_max_damage = 0;
   let total_min_damage = 0;
+  let total_max_damage_percentage = 0;
+  let total_min_damage_percentage = 0;
   function calculate_damage() {
     let attacker;
     let defender;
@@ -60,10 +62,12 @@
       // 攻撃側タイプ
       // TODO: try catchでエラーハンドリング
       atk_type: JSON.parse(attacker.types), // 配列なのでjson parse
-      atk_terastype : JSON.parse(attacker.terastype),
+      atk_terastype: attacker.terastype,
       // 防御側タイプ
-      def_type: JSON.parse(defender.types),
-      def_terastype : JSON.parse(defender.terastype),
+      def_type:
+        defender.terastype[0] > 0
+          ? defender.terastype
+          : JSON.parse(defender.types),
 
       // 技タイプ
       move_type: JSON.parse(attackData.types),
@@ -85,9 +89,10 @@
           - タイプ一致あり等倍(半減と抜群): 76~91(これはモロバレルで計算)
     */
     let d = damage(data);
-
     total_max_damage = d.maxDamage;
     total_min_damage = d.minDamage;
+    total_max_damage_percentage = (d.maxDamage * 100) / defender.hp;
+    total_min_damage_percentage = (d.minDamage * 100) / defender.hp;
   }
   function damage(data) {
     // 基本の計算
@@ -110,46 +115,51 @@
     // 乱数補正
     data.minDamage = getMinDamage(data);
     // タイプ一致などの倍率
-    let magnification = 1 // タイプ相性倍率
-    let magnification_terastype = 1 // タイプ一致補正 テラスタル含む
+    let magnification = 1; // タイプ相性倍率
+    let magnification_terastype = 1; // タイプ一致補正 テラスタル含む
 
     // ポケモンのタイプとテラスタルのタイプ一致の判定
-    let is_terastype = data.atk_terastype !== 0
-    let terastype_match = false
-    if (is_terastype){
-      terastype_match = data.atk_type.includes(data.atk_terastype)
+    let is_terastype = data.atk_terastype !== 0;
+    let terastype_match = false;
+    if (is_terastype) {
+      terastype_match = data.atk_type.includes(data.atk_terastype[0]);
     }
 
     // ポケモンのタイプと技のタイプの判定
     // 1. テラスタルしてるなら、テラスタルのタイプで判定
     // 2. テラスタルしていないなら、元のタイプで判定
-    let atk_type
-    if (is_terastype){
+    let atk_type;
+    if (is_terastype) {
       atk_type = data.atk_terastype;
     } else {
-      atk_type = data.atk_type
+      atk_type = data.atk_type;
     }
-    let type_match = data.atk_type.findIndex((type) => type === data.move_type[0]) > -1
+    let type_match =
+      data.atk_type.findIndex((type) => type === data.move_type[0]) > -1;
     // Note:
     // フライングプレスだけ格闘と飛行の2属性があるが、タイプ一致補正は格闘にだけ補正が掛かる
     // data.move_type[0] = 7で格闘が取れるのでOK
 
     // 技のタイプとテラスタルのタイプの一致判定
-    let movetype_match = false
-    if (is_terastype){
-      movetype_match = data.move_type.includes(data.atk_terastype)
+    let movetype_match = false;
+    if (is_terastype) {
+      movetype_match = data.move_type.includes(data.atk_terastype);
     }
-
+    console.log(type_match, is_terastype, terastype_match);
     // 技のタイプ一致倍率(技のタイプが一致するかどうか)
     // 本来のタイプ	テラスタルタイプ	倍率
-    if ( type_match && is_terastype && terastype_match){
+    if (type_match && is_terastype && terastype_match) {
       // 1. 一致する	一致する	=> x2
-      magnification_terastype = 2
-    } else if ((type_match && is_terastype && !terastype_match) || (type_match && !is_terastype) || (!type_match && is_terastype && movetype_match)){
+      magnification_terastype = 2;
+    } else if (
+      (type_match && is_terastype && !terastype_match) ||
+      (type_match && !is_terastype) ||
+      (!type_match && is_terastype && movetype_match)
+    ) {
       // 2. 一致する	一致しない	=> x1.5
       // 3. 一致する	テラスタルなし	=> x1.5
       // 4. 一致しない	一致する	=> x1.5 NG
-      magnification_terastype =1.5
+      magnification_terastype = 1.5;
     }
     // 5. 一致しない	一致しない	1
     // 6. 一致しない	テラスタルなし	1
@@ -157,7 +167,7 @@
 
     // 相性補正
     // 相性補正の倍率を計算
-    magnification = getCompatibility(data)
+    magnification = getCompatibility(data);
 
     // やけど補正
     // 壁補正
@@ -176,10 +186,10 @@
     // ダイマックス技などの軽減(M protect)
 
     // 最後に倍率かける
-    data.maxDamage = Math.trunc(data.maxDamage * magnification_terastype)
-    data.minDamage = Math.trunc(data.minDamage * magnification_terastype)
-    data.maxDamage = Math.trunc(data.maxDamage * magnification)
-    data.minDamage = Math.trunc(data.minDamage * magnification)
+    data.maxDamage = Math.trunc(data.maxDamage * magnification_terastype);
+    data.minDamage = Math.trunc(data.minDamage * magnification_terastype);
+    data.maxDamage = Math.trunc(data.maxDamage * magnification);
+    data.minDamage = Math.trunc(data.minDamage * magnification);
 
     return data;
   }
@@ -193,19 +203,19 @@
   }
   // 相性計算
   // 倍率だけ返す
-  function getCompatibility(data){
-    let type_magnification = 1
+  function getCompatibility(data) {
+    let type_magnification = 1;
 
     // 技のタイプの相性倍率とりだす
     // attack_types の json の index と move_type の数字が1つずれてる
-    let compatibility = attack_types[data.move_type-1]
+    let compatibility = attack_types[data.move_type - 1];
 
     // 相手のタイプ毎に倍率計算
-    for (let i = 0; i < data.def_type.length; i++){
+    for (let i = 0; i < data.def_type.length; i++) {
       // 倍率
-      type_magnification *= compatibility[data.def_type[i]-1] // ここもindexずれる
+      type_magnification *= compatibility[data.def_type[i] - 1]; // ここもindexずれる
     }
-    return type_magnification
+    return type_magnification;
   }
   async function getItems(keyword) {
     try {
@@ -253,22 +263,25 @@
           bind:value={myValue}
         />
       </td>
-      <td
-        ><input
-          type="button"
-          value="Calculate"
-          on:click={calculate_damage}
-        /></td
-      >
+      <td>
+        <input type="button" value="Calculate" on:click={calculate_damage} />
+      </td>
       <td>Total Damage: {total_min_damage} ~ {total_max_damage}</td>
+      <td>
+        Percentage: {total_min_damage_percentage}% ~ {total_max_damage_percentage}%
+      </td>
     </tr>
   </table>
-  {JSON.stringify(player1Data)} -
-  {JSON.stringify(player2Data)}<br />
-  {attack_direction}
+  <div class="debug-data">
+    {JSON.stringify(player1Data)} -
+    {JSON.stringify(player2Data)}
+  </div>
 </div>
 
 <style>
+  .debug-data {
+    font-size: 10px;
+  }
   .calculator {
     height: 100px;
     width: 100%;