body,html{height:100%;font-size:100%}body{margin:0;padding:0;user-select:none;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;overflow:hidden}p{font-size:1em;margin-bottom:.5rem}h2{font-family:'Yusei Magic',sans-serif;font-size:2.5rem}#modal_comment{font-family:'Yusei Magic',sans-serif;font-size:1.25rem}.red_font{font-size:1.75rem;color:#ff1493}.marker_yellow{background:linear-gradient(transparent 60%,#ff6 60%)}#container{position:absolute;margin:auto;left:0;right:0;top:0;bottom:0;width:750px;height:500px}.elms{position:absolute;width:0;height:0}.bottles{user-select:none;touch-action:none;-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;position:absolute}.buttons{user-select:none;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;position:absolute}.pict{width:100%;height:auto}#main_count{margin:0 auto;position:absolute;text-align:center;font-family:Poppins,sans-serif;font-size:36px;left:620px;top:45px;color:#fff}.count{position:absolute;width:100px;height:54px}.add_text_1{text-align:center;font-family:Poppins,sans-serif;font-size:2em;color:#99dfe0}.add_text_2{text-align:center;font-family:Poppins,sans-serif;font-size:2em;color:#ff1493}.add_text_3{width:80px;transform:translate(0,22px);text-align:center;font-family:Poppins,sans-serif;font-size:1.5em;color:#fff}.add_text_4{width:80px;transform:translate(0,45px);text-align:center;font-family:Poppins,sans-serif;font-size:1em;color:#fff}#b_A{margin:0 auto;width:90px;left:90px;top:90px}#b_B{margin:0 auto;left:285px;top:156px}#b_C{margin:0 auto;left:475px;top:210px}#boxA{margin:0 auto;width:90px;left:90px;top:400px}#boxB{margin:0 auto;left:285px;top:400px}#boxC{margin:0 auto;left:475px;top:400px}#reset_btn{width:80px;height:80px;background-color:#cbcbcb;border-radius:40px;transform:translate(630px,380px)}#count_box{width:80px;height:80px;background-color:#cbcbcb;border-radius:40px;transform:translate(630px,40px)}.column{display:flex}.contentA{width:60%}.contentB{width:40%;margin:auto}@media screen and (orientation:portrait){p{font-size:1em;margin-bottom:.25rem}h2{font-size:1.5rem}.red_font{font-size:1.25rem}#container{width:750px;height:1334px}#reset_btn{width:120px;height:120px;border-radius:60px;transform:translate(570px,877px)}#b_A{width:135px;left:77.5px;top:304px}#b_B{left:335px;top:403.5px}#b_C{left:562.5px;top:484.5px}#boxA{width:135px;left:77.5px;top:767px}#boxB{left:335px;top:767px}#boxC{left:562.5px;top:767px}.add_text_1{font-size:3em;color:#99dfe0}.add_text_2{font-size:3em;color:#ff1493}#count_box{width:120px;height:120px;border-radius:60px;transform:translate(60px,877px)}#main_count{width:120px;text-align:center;font-family:Poppins,sans-serif;font-size:3em;left:60px;top:887px}.add_text_3{width:120px;transform:translate(0,33px);font-size:2.25em}.add_text_4{width:120px;transform:translate(0,67.5px);font-size:1.5em}.column{display:block}.contentA{width:100%}.contentB{width:50%;margin:auto}}.bottleC_A{fill:#cceff0}.bottleC_B{fill:#99dfe0}.bottleC_C{fill:#b8e9ea}.bottleC_D{fill:#e0f5f6}.bottleC_E{fill:#79d5df}.bottleC_F{fill:#ade6e7}.btCap_CH{fill:#ccc}.btCap_C{fill:#b2b2b2}.oilC_A{fill:#ffd800}.oilC_B{fill:#ffeb80}.oilC_C{fill:#ffe44c}.oilC_D{fill:#ffef99}.oilC_E{fill:#ffc800}.oilC_F{fill:#ffe033}.modalArea{visibility:hidden;opacity:0;position:fixed;z-index:10000;top:0;left:0;width:100%;height:100%;transition:.4s}.modalBg{width:100%;height:100%;background-color:rgba(0,0,0,.4)}.modalWrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:70%;max-width:600px;padding:20px 30px;background-color:#fff;border-radius:10px}.closeModal{position:absolute;font-size:2rem;top:.5rem;right:1rem;cursor:pointer}.is-show{visibility:visible;opacity:1}.bg{animation:slide 9s ease-in-out infinite alternate;background-image:linear-gradient(-60deg,#f4deff 50%,#fff 50%);bottom:0;left:-50%;opacity:.3;position:fixed;right:-50%;top:0;z-index:-100}.bg2{animation-direction:alternate-reverse;animation-duration:12s}.bg3{animation-duration:15s}@keyframes slide{0%{transform:translateX(-25%)}100%{transform:translateX(25%)}}.flash{animation:flash 1s linear infinite}@keyframes flash{0%,100%{opacity:1}50%{opacity:.3}}