css와 image 추가

+body {
+    width: 100%;
+    height: 100%;
+    background-size: auto;
+}
+.Chess {
+    height: 100%;
+    width: 100%;
+    position:absolute;
+}
+.Banner {
+    position: relative;
+    height: 215px;
+    width: 100%;
+    background: linear-gradient(100deg,black,gray);
+    z-index: 1;
+}
+.Icon {
+    position: absolute;
+    width: 450px;
+    height: 165px;
+    top: 50px;
+    left: 80px;
+    float: left;
+    z-index: 3;
+}
+.Button {
+    position:absolute;
+    top:0;
+    height: 300px;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size:xx-large;
+}
+.Button_e {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    height: 215px;
+    width: 250px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    float: left;
+    z-index: 3;
+}
+.Button2 {
+    position: relative;
+    height: 200px;
+    width: 100%;
+    text-align: center;
+    margin-top:15px;
+}
+.Bannerpng {
+    position: absolute;
+    width: 615px;
+    height: 215px;
+    top: 0;
+    right: 115px;
+    float: right;
+    z-index: 2;
+}
+.tier{
+    position:absolute;
+    top:30px;
+    right: 58%;
+}
+.tier__summary {
+    position: absolute;
+    top: 80px;
+    right:45%;
+}
+.game {
+    position: absolute;
+    top: 80px;
+    right: 45%;
+}
+

+[
+  {
+    "name": "Ahri",
+    "championId": "TFT3_Ahri",
+    "cost": 2,
+    "traits": [
+      "Star Guardian",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Annie",
+    "championId": "TFT3_Annie",
+    "cost": 2,
+    "traits": [
+      "Mech-Pilot",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Ashe",
+    "championId": "TFT3_Ashe",
+    "cost": 3,
+    "traits": [
+      "Celestial",
+      "Sniper"
+    ]
+  },
+  {
+    "name": "Aurelion Sol",
+    "championId": "TFT3_AurelionSol",
+    "cost": 5,
+    "traits": [
+      "Rebel",
+      "Starship"
+    ]
+  },
+  {
+    "name": "Bard",
+    "championId": "TFT3_Bard",
+    "cost": 3,
+    "traits": [
+      "Astro",
+      "Mystic"
+    ]
+  },
+  {
+    "name": "Blitzcrank",
+    "championId": "TFT3_Blitzcrank",
+    "cost": 2,
+    "traits": [
+      "Chrono",
+      "Brawler"
+    ]
+  },
+  {
+    "name": "Caitlyn",
+    "championId": "TFT3_Caitlyn",
+    "cost": 1,
+    "traits": [
+      "Chrono",
+      "Sniper"
+    ]
+  },
+  {
+    "name": "Cassiopeia",
+    "championId": "TFT3_Cassiopeia",
+    "cost": 3,
+    "traits": [
+      "Battlecast",
+      "Mystic"
+    ]
+  },
+  {
+    "name": "Darius",
+    "championId": "TFT3_Darius",
+    "cost": 2,
+    "traits": [
+      "Space Pirate",
+      "Mana-Reaver"
+    ]
+  },
+  {
+    "name": "Ekko",
+    "championId": "TFT3_Ekko",
+    "cost": 5,
+    "traits": [
+      "Cybernetic",
+      "Infiltrato"
+    ]
+  },
+  {
+    "name": "Ezreal",
+    "championId": "TFT3_Ezreal",
+    "cost": 3,
+    "traits": [
+      "Chrono",
+      "Blaster"
+    ]
+  },
+  {
+    "name": "Fiora",
+    "championId": "TFT3_Fiora",
+    "cost": 1,
+    "traits": [
+      "Cybernetic",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Fizz",
+    "championId": "TFT3_Fizz",
+    "cost": 4,
+    "traits": [
+      "Mech-Pilot",
+      "Infiltrator"
+    ]
+  },
+  {
+    "name": "Gangplank",
+    "championId": "TFT3_Gangplank",
+    "cost": 5,
+    "traits": [
+      "Space Pirate",
+      "Mercenary",
+      "Demolitionist"
+    ]
+  },
+  {
+    "name": "Gnar",
+    "championId": "TFT3_Gnar",
+    "cost": 4,
+    "traits": [
+      "Astro",
+      "Brawler"
+    ]
+  },
+  {
+    "name": "Graves",
+    "championId": "TFT3_Graves",
+    "cost": 1,
+    "traits": [
+      "Space Pirate",
+      "Blaster"
+    ]
+  },
+  {
+    "name": "Illaoi",
+    "championId": "TFT3_Illaoi",
+    "cost": 1,
+    "traits": [
+      "Battlecast",
+      "Brawler"
+    ]
+  },
+  {
+    "name": "Irelia",
+    "championId": "TFT3_Irelia",
+    "cost": 4,
+    "traits": [
+      "Cybernetic",
+      "Mana-Reaver",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Janna",
+    "championId": "TFT3_Janna",
+    "cost": 5,
+    "traits": [
+      "Star Guardian",
+      "Paragon"
+    ]
+  },
+  {
+    "name": "Jarvan IV",
+    "championId": "TFT3_JarvanIV",
+    "cost": 1,
+    "traits": [
+      "Dark Star",
+      "Protector"
+    ]
+  },
+  {
+    "name": "Jayce",
+    "championId": "TFT3_Jayce",
+    "cost": 3,
+    "traits": [
+      "Space Pirate",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Jhin",
+    "championId": "TFT3_Jhin",
+    "cost": 4,
+    "traits": [
+      "Dark Star",
+      "Sniper"
+    ]
+  },
+  {
+    "name": "Jinx",
+    "championId": "TFT3_Jinx",
+    "cost": 4,
+    "traits": [
+      "Rebel",
+      "Blaster"
+    ]
+  },
+  {
+    "name": "Karma",
+    "championId": "TFT3_Karma",
+    "cost": 3,
+    "traits": [
+      "Dark Star",
+      "Mystic"
+    ]
+  },
+  {
+    "name": "Kog'Maw",
+    "championId": "TFT3_KogMaw",
+    "cost": 2,
+    "traits": [
+      "Battlecast",
+      "Blaster"
+    ]
+  },
+  {
+    "name": "Leona",
+    "championId": "TFT3_Leona",
+    "cost": 1,
+    "traits": [
+      "Cybernetic",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Lucian",
+    "championId": "TFT3_Lucian",
+    "cost": 2,
+    "traits": [
+      "Cybernetic",
+      "Blaster"
+    ]
+  },
+  {
+    "name": "Lulu",
+    "championId": "TFT3_Lulu",
+    "cost": 5,
+    "traits": [
+      "Celestial",
+      "Mystic"
+    ]
+  },
+  {
+    "name": "Malphite",
+    "championId": "TFT3_Malphite",
+    "cost": 1,
+    "traits": [
+      "Rebel",
+      "Brawler"
+    ]
+  },
+  {
+    "name": "Master Yi",
+    "championId": "TFT3_MasterYi",
+    "cost": 3,
+    "traits": [
+      "Rebel",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Mordekaiser",
+    "championId": "TFT3_Mordekaiser",
+    "cost": 2,
+    "traits": [
+      "Dark Star",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Nautilus",
+    "championId": "TFT3_Nautilus",
+    "cost": 2,
+    "traits": [
+      "Astro",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Neeko",
+    "championId": "TFT3_Neeko",
+    "cost": 3,
+    "traits": [
+      "Star Guardian",
+      "Protector"
+    ]
+  },
+  {
+    "name": "Nocturne",
+    "championId": "TFT3_Nocturne",
+    "cost": 1,
+    "traits": [
+      "Battlecast",
+      "Infiltrator"
+    ]
+  },
+  {
+    "name": "Poppy",
+    "championId": "TFT3_Poppy",
+    "cost": 1,
+    "traits": [
+      "Star Guardian",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Rakan",
+    "championId": "TFT3_Rakan",
+    "cost": 2,
+    "traits": [
+      "Celestial",
+      "Protector"
+    ]
+  },
+  {
+    "name": "Riven",
+    "championId": "TFT3_Riven",
+    "cost": 4,
+    "traits": [
+      "Chrono",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Rumble",
+    "championId": "TFT3_Rumble",
+    "cost": 3,
+    "traits": [
+      "Mech-Pilot",
+      "Demolitionist"
+    ]
+  },
+  {
+    "name": "Shaco",
+    "championId": "TFT3_Shaco",
+    "cost": 3,
+    "traits": [
+      "Dark Star",
+      "Infiltrator"
+    ]
+  },
+  {
+    "name": "Shen",
+    "championId": "TFT3_Shen",
+    "cost": 2,
+    "traits": [
+      "Chrono",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Soraka",
+    "championId": "TFT3_Soraka",
+    "cost": 4,
+    "traits": [
+      "Star Guardian",
+      "Mystic"
+    ]
+  },
+  {
+    "name": "Syndra",
+    "championId": "TFT3_Syndra",
+    "cost": 3,
+    "traits": [
+      "Star Guardian",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Teemo",
+    "championId": "TFT3_Teemo",
+    "cost": 4,
+    "traits": [
+      "Astro",
+      "Sniper"
+    ]
+  },
+  {
+    "name": "Thresh",
+    "championId": "TFT3_Thresh",
+    "cost": 5,
+    "traits": [
+      "Chrono",
+      "Mana-Reaver"
+    ]
+  },
+  {
+    "name": "Twisted Fate",
+    "championId": "TFT3_TwistedFate",
+    "cost": 1,
+    "traits": [
+      "Chrono",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Urgot",
+    "championId": "TFT3_Urgot",
+    "cost": 5,
+    "traits": [
+      "Battlecast",
+      "Protector"
+    ]
+  },
+  {
+    "name": "Vayne",
+    "championId": "TFT3_Vayne",
+    "cost": 3,
+    "traits": [
+      "Cybernetic",
+      "Sniper"
+    ]
+  },
+  {
+    "name": "Vi",
+    "championId": "TFT3_Vi",
+    "cost": 3,
+    "traits": [
+      "Cybernetic",
+      "Brawler"
+    ]
+  },
+  {
+    "name": "Viktor",
+    "championId": "TFT3_Viktor",
+    "cost": 4,
+    "traits": [
+      "Battlecast",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Wukong",
+    "championId": "TFT3_WuKong",
+    "cost": 4,
+    "traits": [
+      "Chrono",
+      "Vanguard"
+    ]
+  },
+  {
+    "name": "Xayah",
+    "championId": "TFT3_Xayah",
+    "cost": 1,
+    "traits": [
+      "Celestial",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Xerath",
+    "championId": "TFT3_Xerath",
+    "cost": 5,
+    "traits": [
+      "Dark Star",
+      "Sorcerer"
+    ]
+  },
+  {
+    "name": "Xin Zhao",
+    "championId": "TFT3_XinZhao",
+    "cost": 2,
+    "traits": [
+      "Celestial",
+      "Protector"
+    ]
+  },
+  {
+    "name": "Yasuo",
+    "championId": "TFT3_Yasuo",
+    "cost": 2,
+    "traits": [
+      "Rebel",
+      "Blademaster"
+    ]
+  },
+  {
+    "name": "Zed",
+    "championId": "TFT3_Zed",
+    "cost": 2,
+    "traits": [
+      "Rebel",
+      "Infiltrator"
+    ]
+  },
+  {
+    "name": "Ziggs",
+    "championId": "TFT3_Ziggs",
+    "cost": 1,
+    "traits": [
+      "Rebel",
+      "Demolitionist"
+    ]
+  },
+  {
+    "name": "Zoe",
+    "championId": "TFT3_Zoe",
+    "cost": 1,
+    "traits": [
+      "Star Guardian",
+      "Sorcerer"
+    ]
+  }
+]
\ No newline at end of file

+[
+  {
+    "key": "TFT3_GameVariation_BigLittleLegends",
+    "name": "Medium Legends",
+    "description": "Little Legends are bigger and have +25 starting health."
+  },
+  {
+    "key": "TFT3_GameVariation_Bonanza",
+    "name": "Treasure Trove",
+    "description": "All minions and monsters drop a loot orb."
+  },
+  {
+    "key": "TFT3_GameVariation_FreeNeekos",
+    "name": "The Neekoverse",
+    "description": "Everyone gets two free copies of Neeko’s Help."
+  },
+  {
+    "key": "TFT3_GameVariation_FreeRerolls",
+    "name": "Trade Sector",
+    "description": "All players receive one free reroll per round. Free rerolls cannot be saved up."
+  },
+  {
+    "key": "TFT3_GameVariation_MidGameFoN",
+    "name": "Superdense Galaxy",
+    "description": "Receive a free Force of Nature after the stage 3 carousel."
+  },
+  {
+    "key": "TFT3_GameVariation_None",
+    "name": "Normal Game",
+    "description": "No special rules."
+  },
+  {
+    "key": "TFT3_GameVariation_StartingItems",
+    "name": "Galactic Armory",
+    "description": "All players start with the same 2 completed items."
+  },
+  {
+    "key": "TFT3_GameVariation_TwoStarCarousels",
+    "name": "Star Cluster",
+    "description": "1, 2, and 3 cost units on carousels have two stars."
+  }
+]
\ No newline at end of file

+[
+  {
+    "id": 1,
+    "name": "B.F. Sword"
+  },
+  {
+    "id": 2,
+    "name": "Recurve Bow"
+  },
+  {
+    "id": 3,
+    "name": "Needlessly Large Rod"
+  },
+  {
+    "id": 4,
+    "name": "Tear of the Goddess"
+  },
+  {
+    "id": 5,
+    "name": "Chain Vest"
+  },
+  {
+    "id": 6,
+    "name": "Negatron Cloak"
+  },
+  {
+    "id": 7,
+    "name": "Giant's Belt"
+  },
+  {
+    "id": 8,
+    "name": "Spatula"
+  },
+  {
+    "id": 9,
+    "name": "Sparring Gloves"
+  },
+  {
+    "id": 11,
+    "name": "Deathblade"
+  },
+  {
+    "id": 12,
+    "name": "Giant Slayer"
+  },
+  {
+    "id": 13,
+    "name": "Hextech Gunblade"
+  },
+  {
+    "id": 14,
+    "name": "Spear of Shojin"
+  },
+  {
+    "id": 15,
+    "name": "Guardian Angel"
+  },
+  {
+    "id": 16,
+    "name": "Bloodthirster"
+  },
+  {
+    "id": 17,
+    "name": "Zeke's Herald"
+  },
+  {
+    "id": 18,
+    "name": "Blade of the Ruined King"
+  },
+  {
+    "id": 19,
+    "name": "Infinity Edge"
+  },
+  {
+    "id": 22,
+    "name": "Rapid Firecannon"
+  },
+  {
+    "id": 23,
+    "name": "Guinsoo's Rageblade"
+  },
+  {
+    "id": 24,
+    "name": "Statikk Shiv"
+  },
+  {
+    "id": 25,
+    "name": "Titan's Resolve"
+  },
+  {
+    "id": 26,
+    "name": "Runaan's Hurricane"
+  },
+  {
+    "id": 27,
+    "name": "Zz'Rot Portal"
+  },
+  {
+    "id": 28,
+    "name": "Infiltrator's Talons"
+  },
+  {
+    "id": 29,
+    "name": "Last Whisper"
+  },
+  {
+    "id": 33,
+    "name": "Rabadon's Deathcap"
+  },
+  {
+    "id": 34,
+    "name": "Luden's Echo"
+  },
+  {
+    "id": 35,
+    "name": "Locket of the Iron Solari"
+  },
+  {
+    "id": 36,
+    "name": "Ionic Spark"
+  },
+  {
+    "id": 37,
+    "name": "Morellonomicon"
+  },
+  {
+    "id": 38,
+    "name": "Battlecast Armor"
+  },
+  {
+    "id": 39,
+    "name": "Jeweled Gauntlet"
+  },
+  {
+    "id": 44,
+    "name": "Seraph's Embrace"
+  },
+  {
+    "id": 45,
+    "name": "Frozen Heart"
+  },
+  {
+    "id": 46,
+    "name": "Chalice of Favor"
+  },
+  {
+    "id": 47,
+    "name": "Redemption"
+  },
+  {
+    "id": 48,
+    "name": "Star Guardian's Charm"
+  },
+  {
+    "id": 49,
+    "name": "Hand Of Justice"
+  },
+  {
+    "id": 55,
+    "name": "Bramble Vest"
+  },
+  {
+    "id": 56,
+    "name": "Sword Breaker"
+  },
+  {
+    "id": 57,
+    "name": "Red Buff"
+  },
+  {
+    "id": 58,
+    "name": "Rebel Medal"
+  },
+  {
+    "id": 59,
+    "name": "Shroud of Stillness"
+  },
+  {
+    "id": 66,
+    "name": "Dragon's Claw"
+  },
+  {
+    "id": 67,
+    "name": "Zephyr"
+  },
+  {
+    "id": 68,
+    "name": "Celestial Orb"
+  },
+  {
+    "id": 69,
+    "name": "Quicksilver"
+  },
+  {
+    "id": 77,
+    "name": "Warmog's Armor"
+  },
+  {
+    "id": 78,
+    "name": "Protector's Chestguard"
+  },
+  {
+    "id": 79,
+    "name": "Trap Claw"
+  },
+  {
+    "id": 88,
+    "name": "Force of Nature"
+  },
+  {
+    "id": 89,
+    "name": "Dark Star's Heart"
+  },
+  {
+    "id": 99,
+    "name": "Thief's Gloves"
+  }
+]
\ No newline at end of file