#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50}.selector[data-v-e5ecc624]{display:inline-block}.wrap[data-v-88f063a4]{margin:40px;position:relative;height:80px;min-height:80px;width:80px;min-width:80px;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}.wrap .tone-button[data-v-88f063a4]{height:80px;width:80px;border-radius:100%;border-width:4px;outline:none;background-color:transparent;border-color:#000;font-weight:700;font-size:16px;cursor:pointer;padding:0}.wrap .tone-button.on[data-v-88f063a4]{background-color:#5f9ea0}.wrap .tone-button.base[data-v-88f063a4]{border-width:6px}.wrap .octave-button[data-v-88f063a4]{position:absolute;text-align:center;left:0;width:40px;background-color:transparent;padding:0 20px;margin:0;z-index:100}.wrap .octave-button>.image[data-v-88f063a4]{width:40px;height:auto}.wrap .octave-button.up[data-v-88f063a4]{top:-40px}.wrap .octave-button.up>.image[data-v-88f063a4]{fill:#fe914d}.wrap .octave-button.down[data-v-88f063a4]{top:80px}.wrap .octave-button.down>.image[data-v-88f063a4]{fill:#4988b8}.wrap .octave-button.hidden[data-v-88f063a4]{display:none}.wrap .allow[data-v-88f063a4]{height:80px;width:80px;line-height:80px;text-align:center;position:absolute;left:80px;font-weight:700;font-size:16px}.wrap .allow.up[data-v-88f063a4]{-webkit-transform:translate(-40px,-80px) rotate(-60deg);transform:translate(-40px,-80px) rotate(-60deg)}.wrap .allow.down[data-v-88f063a4]{-webkit-transform:translate(-40px,80px) rotate(60deg);transform:translate(-40px,80px) rotate(60deg)}@media screen and (min-width:720px){.all-wrap[data-v-06c89b4e]{margin:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}}.all-wrap .buttons-wrap[data-v-06c89b4e]{overflow-x:scroll}.all-wrap .buttons-wrap .tone-button-row[data-v-06c89b4e]{display:-webkit-box;display:flex}.all-wrap .buttons-wrap .tone-button-row.slide[data-v-06c89b4e]{padding-left:80px}.name[data-v-b939407a]{width:calc(100vw - 16px);text-align:center;font-weight:700;margin:0;font-size:1rem;opacity:.7}.name>.second[data-v-b939407a]{font-size:.8rem}