body{font:14px "Century Gothic",Futura,sans-serif;margin:20px}.about-container{margin-top:40px;width:100%;background-color:#f1f1f1}.about{padding:10px 0 10px 30px;max-width:300px;color:#202020}.select-none{-webkit-user-select:none;-ms-user-select:none;user-select:none}.p10{padding:10px}.m10{margin:10px}.flex-end{align-items:flex-end}.flex{display:flex;margin:0}.fret{width:100vw}.finger{width:8%;height:64x;outline:none;border:none;border-radius:0}.b20,.finger{text-align:center}.b20{width:30px;margin-top:0;margin-bottom:0}.finger.pushed{background-color:#413030;color:#fff}.arrow{margin:10px 3px 3px;width:40px;height:40px;background-color:#bcd2e7;border:none;transition:all .2s}.arrow:hover{background-color:#b3e0ff}.arrow:active{background-color:#adbeff}.finger.pushed.open{background-color:#a7a1a1}.sound{padding-left:10px}.root{font-size:xx-large;font-weight:900;margin:32px}.sign{background:#fff}.chord{background-color:#afafaf;width:100px;height:32px;margin:10px;border:none}.chord:hover{background-color:#878a8a}.chord:active{border:solid}.spect-span{width:1px;height:100px;font-size:0}.spect-span,.w60{display:inline-block}.w60{width:60px;height:60px;overflow:hidden}.w720{display:block;width:720px}.text-center{text-align:center}.relative{position:relative}.absolute{position:absolute}.h512{height:512px;width:512px}.param{display:inline-block;font-weight:700;font-size:24px;color:#464646;margin-bottom:10px}.param-button{width:120px;height:32px;margin-right:16px}.swing{-webkit-transform-origin:130px 300px;transform-origin:130px 300px;-webkit-animation:swing .25s ease-in-out 1s infinite;animation:swing .25s ease-in-out 1s infinite}@-webkit-keyframes swing{0%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}to{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}@keyframes swing{0%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}to{-webkit-transform:rotate(10deg);transform:rotate(10deg)}}.slow-swing{-webkit-animation:swing 1.05s ease-in-out 1s infinite;animation:swing 1.05s ease-in-out 1s infinite;-webkit-transform-origin:center bottom;transform-origin:center bottom}.margin{margin-top:-10px;margin-left:30px}.pointer-none{pointer-events:none}@-webkit-keyframes tiktok{0%{-webkit-transform:translateX(3px);transform:translateX(3px)}50%{-webkit-transform:translateX(3px);transform:translateX(3px)}51%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}to{-webkit-transform:translateX(-5px);transform:translateX(-5px)}}@keyframes tiktok{0%{-webkit-transform:translateX(3px);transform:translateX(3px)}50%{-webkit-transform:translateX(3px);transform:translateX(3px)}51%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}to{-webkit-transform:translateX(-5px);transform:translateX(-5px)}}.tiktok-swing{-webkit-animation:tiktok 1s ease-in-out 1s infinite;animation:tiktok 1s ease-in-out 1s infinite}.input-num{font-size:24px;font-weight:700;color:#494949;text-align:center;padding:10px;margin-right:30px;margin-left:30px}.no-spin::-webkit-inner-spin-button,.no-spin::-webkit-outer-spin-button{-webkit-appearance:none!important;margin:0!important;-moz-appearance:textfield!important}.over-hidden{overflow:hidden}
/*# sourceMappingURL=main.0a1db9e5.chunk.css.map */