{"version":3,"sources":["_basic.scss","03_04.css","_setting.scss","_module.scss","_common.scss","_scale.scss"],"names":[],"mappings":"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","file":"03_04.css","sourcesContent":["@charset \"UTF-8\";\r\n\r\n// =======================================\r\n// basic\r\n// =======================================\r\n\r\nhtml {\r\n  font-size: 62.5%;\r\n}\r\n\r\nbody {\r\n  color: #000;\r\n  background-color: #fff;\r\n  line-height: 1;\r\n  font-size: 1.6rem;\r\n  -webkit-text-size-adjust: 100%;\r\n  -webkit-font-smoothing: antialiased;\r\n  width: 100%;\r\n  height: 100%;\r\n  min-width: 320px;\r\n  // min-width: 1024px;\r\n  // min-height: 768px;\r\n  margin: 0 auto;\r\n  font-family: $font-base;\r\n}\r\n\r\na {\r\n  color: #000;\r\n  transition: 0.5s;\r\n}\r\n\r\nbutton {\r\n  font-family: $font-base;\r\n}\r\n","html {\n  font-size: 62.5%;\n}\n\nbody {\n  color: #000;\n  background-color: #fff;\n  line-height: 1;\n  font-size: 1.6rem;\n  -webkit-text-size-adjust: 100%;\n  -webkit-font-smoothing: antialiased;\n  width: 100%;\n  height: 100%;\n  min-width: 320px;\n  margin: 0 auto;\n  font-family: Meiryo, -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", \"Hiragino Kaku Gothic ProN\", sans-serif;\n}\n\na {\n  color: #000;\n  transition: 0.5s;\n}\n\nbutton {\n  font-family: Meiryo, -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", \"Hiragino Kaku Gothic ProN\", sans-serif;\n}\n\n.container {\n  display: block;\n  position: relative;\n  margin: 0 auto;\n  width: 100%;\n}\n\n.page-container {\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n}\n\n.page {\n  position: relative;\n  width: 100%;\n  max-width: 1410px;\n  margin: 0 auto;\n}\n\n@media only screen and (min-width: 1024px) {\n  .page {\n    width: calc(100% - 100px);\n  }\n}\n\n@media only screen and (min-width: 1260px) {\n  .page {\n    width: calc(100% - 200px);\n  }\n}\n\n@media only screen and (min-width: 1610px) {\n  .page {\n    width: 1410px;\n  }\n}\n\n.main {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  z-index: 10;\n}\n\n.main-box {\n  position: relative;\n  height: 100%;\n}\n\n.scale-caption {\n  position: relative;\n  width: 16%;\n  aspect-ratio: 1 / 1;\n  padding: 2%;\n}\n\n@media screen and (min-width: 851px) and (min-aspect-ratio: 5 / 2) {\n  .scale-caption {\n    width: 14%;\n  }\n}\n\n.scale-caption.unit--1kg .scale-caption__box.unit--1kg {\n  display: block;\n}\n\n.scale-caption.unit--4kg .scale-caption__box.unit--4kg {\n  display: block;\n}\n\n.scale-caption img {\n  width: 100%;\n}\n\n.scale-caption__box {\n  display: none;\n}\n\n.scale-boxes {\n  display: flex;\n  justify-self: center;\n  align-items: center;\n  margin: 0 auto;\n  padding: 0 4vw;\n}\n\n@media only screen and (min-width: 1024px) {\n  .scale-boxes {\n    padding: 0;\n  }\n}\n\n@media screen and (min-width: 851px) and (min-aspect-ratio: 2 / 1) {\n  .scale-boxes {\n    width: 80%;\n  }\n}\n\n@media screen and (min-width: 851px) and (min-aspect-ratio: 5 / 2) {\n  .scale-boxes {\n    width: 70%;\n  }\n}\n\n@media screen and (min-width: 851px) and (min-aspect-ratio: 20 / 9) {\n  .scale-boxes {\n    width: 60%;\n  }\n}\n\n.scale-box {\n  position: relative;\n}\n\n.scale-box:first-child {\n  width: 55%;\n}\n\n.scale-box:last-child {\n  width: 45%;\n  padding-left: 5%;\n}\n\n.scale-analog {\n  position: relative;\n  width: 100%;\n  aspect-ratio: 1 / 1;\n  background-size: cover;\n  background-position: 50%;\n  z-index: 10;\n}\n\n.scale-analog.unit--1kg {\n  background-image: url(\"../img/common/scale/scale_1kg_base.png\");\n}\n\n.scale-analog.unit--4kg {\n  background-image: url(\"../img/common/scale/scale_4kg_base.png\");\n}\n\n.scale-analog::before {\n  content: '';\n  display: block;\n  position: absolute;\n  width: 4%;\n  aspect-ratio: 1 / 1;\n  top: 48%;\n  left: 48%;\n  background-image: url(\"../img/common/scale/scale_center.png\");\n  background-size: cover;\n  background-position: 50%;\n  z-index: 30;\n}\n\n.scale-analog__point-box {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  z-index: 15;\n  pointer-events: none;\n}\n\n.scale-analogo__point {\n  position: absolute;\n  background-size: cover;\n  background-position: 50%;\n  transform-origin: 50% 68.5%;\n  pointer-events: all;\n  width: 10%;\n  height: 66%;\n  top: 5%;\n  left: 45%;\n  z-index: 12;\n  background: 50%/contain no-repeat url(\"../img/common/scale/scale_point.png\");\n  cursor: pointer;\n}\n\n.scale-digital {\n  position: absolute;\n  top: -5%;\n  width: 95%;\n}\n\n.scale-digital__box, .scale-digital__box--1kg, .scale-digital__box--4kg {\n  padding-bottom: 0;\n}\n\n.scale-digital__val-box {\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  aspect-ratio: 1 / 0.261;\n}\n\n.scale-digital__val {\n  height: 100%;\n  border: solid 1vmin #2c9fe7;\n}\n\n@media only screen and (min-width: 1024px) {\n  .scale-digital__val {\n    border-width: 10px;\n  }\n}\n\n@media screen and (min-width: 851px) and (min-aspect-ratio: 2 / 1) {\n  .scale-digital__val {\n    border-width: 1vmin;\n  }\n}\n\n.scale-digital__val .no, .scale-digital__val .no--null, .scale-digital__val #scale-digital-val-1 .no--0, #scale-digital-val-1 .scale-digital__val .no--0, .scale-digital__val #scale-digital-val-1 .no--1, #scale-digital-val-1 .scale-digital__val .no--1, .scale-digital__val #scale-digital-val-1 .no--2, #scale-digital-val-1 .scale-digital__val .no--2, .scale-digital__val #scale-digital-val-1 .no--3, #scale-digital-val-1 .scale-digital__val .no--3, .scale-digital__val #scale-digital-val-1 .no--4, #scale-digital-val-1 .scale-digital__val .no--4, .scale-digital__val #scale-digital-val-1 .no--5, #scale-digital-val-1 .scale-digital__val .no--5, .scale-digital__val #scale-digital-val-1 .no--6, #scale-digital-val-1 .scale-digital__val .no--6, .scale-digital__val #scale-digital-val-1 .no--7, #scale-digital-val-1 .scale-digital__val .no--7, .scale-digital__val #scale-digital-val-1 .no--8, #scale-digital-val-1 .scale-digital__val .no--8, .scale-digital__val #scale-digital-val-1 .no--9, #scale-digital-val-1 .scale-digital__val .no--9, .scale-digital__val #scale-digital-val-4-kg .no--0, #scale-digital-val-4-kg .scale-digital__val .no--0, .scale-digital__val #scale-digital-val-4-kg .no--1, #scale-digital-val-4-kg .scale-digital__val .no--1, .scale-digital__val #scale-digital-val-4-kg .no--2, #scale-digital-val-4-kg .scale-digital__val .no--2, .scale-digital__val #scale-digital-val-4-kg .no--3, #scale-digital-val-4-kg .scale-digital__val .no--3, .scale-digital__val #scale-digital-val-4-kg .no--4, #scale-digital-val-4-kg .scale-digital__val .no--4, .scale-digital__val #scale-digital-val-4-kg .no--5, #scale-digital-val-4-kg .scale-digital__val .no--5, .scale-digital__val #scale-digital-val-4-kg .no--6, #scale-digital-val-4-kg .scale-digital__val .no--6, .scale-digital__val #scale-digital-val-4-kg .no--7, #scale-digital-val-4-kg .scale-digital__val .no--7, .scale-digital__val #scale-digital-val-4-kg .no--8, #scale-digital-val-4-kg .scale-digital__val .no--8, .scale-digital__val #scale-digital-val-4-kg .no--9, #scale-digital-val-4-kg .scale-digital__val .no--9, .scale-digital__val #scale-digital-val-4-g .no--0, #scale-digital-val-4-g .scale-digital__val .no--0, .scale-digital__val #scale-digital-val-4-g .no--1, #scale-digital-val-4-g .scale-digital__val .no--1, .scale-digital__val #scale-digital-val-4-g .no--2, #scale-digital-val-4-g .scale-digital__val .no--2, .scale-digital__val #scale-digital-val-4-g .no--3, #scale-digital-val-4-g .scale-digital__val .no--3, .scale-digital__val #scale-digital-val-4-g .no--4, #scale-digital-val-4-g .scale-digital__val .no--4, .scale-digital__val #scale-digital-val-4-g .no--5, #scale-digital-val-4-g .scale-digital__val .no--5, .scale-digital__val #scale-digital-val-4-g .no--6, #scale-digital-val-4-g .scale-digital__val .no--6, .scale-digital__val #scale-digital-val-4-g .no--7, #scale-digital-val-4-g .scale-digital__val .no--7, .scale-digital__val #scale-digital-val-4-g .no--8, #scale-digital-val-4-g .scale-digital__val .no--8, .scale-digital__val #scale-digital-val-4-g .no--9, #scale-digital-val-4-g .scale-digital__val .no--9 {\n  display: inline-block;\n  background-repeat: no-repeat;\n  vertical-align: middle;\n}\n\n.scale-digital__val .no--null {\n  width: 0;\n  display: none;\n}\n\n.scale-digital__unit {\n  position: relative;\n}\n\n.scale-digital__unit img {\n  width: 100%;\n}\n\n.scale-digital__box--1kg .scale-digital__unit {\n  width: 12%;\n  padding-top: 5%;\n  padding-left: 4%;\n}\n\n.scale-digital__box--4kg .scale-digital__unit.unit-kg {\n  width: 18%;\n  padding-top: 5%;\n  padding-left: 2%;\n  padding-right: 4%;\n}\n\n.scale-digital__box--4kg .scale-digital__unit.unit-g {\n  width: 8%;\n  padding-top: 5%;\n  padding-left: 2%;\n}\n\n#scale-digital-val-1 {\n  width: 64%;\n  padding: 2% 4%;\n  padding-left: 0;\n  border-radius: 5% / 12%;\n  text-align: right;\n}\n\n#scale-digital-val-1 .no, #scale-digital-val-1 .scale-digital__val .no--null, .scale-digital__val #scale-digital-val-1 .no--null, #scale-digital-val-1 .no--0, #scale-digital-val-1 .no--1, #scale-digital-val-1 .no--2, #scale-digital-val-1 .no--3, #scale-digital-val-1 .no--4, #scale-digital-val-1 .no--5, #scale-digital-val-1 .no--6, #scale-digital-val-1 .no--7, #scale-digital-val-1 .no--8, #scale-digital-val-1 .no--9 {\n  width: 24%;\n  aspect-ratio: 1 / 1.428;\n  background-size: auto 100%;\n  background-repeat: no-repeat;\n  background-image: url(\"../img/common/scale/scale_num.png\");\n}\n\n#scale-digital-val-1 .no--0 {\n  background-position: 0% 0;\n}\n\n#scale-digital-val-1 .no--1 {\n  background-position: 11.2% 0;\n}\n\n#scale-digital-val-1 .no--2 {\n  background-position: 22.4% 0;\n}\n\n#scale-digital-val-1 .no--3 {\n  background-position: 33.6% 0;\n}\n\n#scale-digital-val-1 .no--4 {\n  background-position: 44.8% 0;\n}\n\n#scale-digital-val-1 .no--5 {\n  background-position: 56% 0;\n}\n\n#scale-digital-val-1 .no--6 {\n  background-position: 67.2% 0;\n}\n\n#scale-digital-val-1 .no--7 {\n  background-position: 78.4% 0;\n}\n\n#scale-digital-val-1 .no--8 {\n  background-position: 89.6% 0;\n}\n\n#scale-digital-val-1 .no--9 {\n  background-position: 100.8% 0;\n}\n\n#scale-digital-val-4-kg {\n  width: 18%;\n  padding: 5% 1%;\n  border-radius: 14% / 10%;\n  text-align: center;\n}\n\n#scale-digital-val-4-kg .no, #scale-digital-val-4-kg .scale-digital__val .no--null, .scale-digital__val #scale-digital-val-4-kg .no--null, #scale-digital-val-4-kg .no--0, #scale-digital-val-4-kg .no--1, #scale-digital-val-4-kg .no--2, #scale-digital-val-4-kg .no--3, #scale-digital-val-4-kg .no--4, #scale-digital-val-4-kg .no--5, #scale-digital-val-4-kg .no--6, #scale-digital-val-4-kg .no--7, #scale-digital-val-4-kg .no--8, #scale-digital-val-4-kg .no--9 {\n  width: 70%;\n  aspect-ratio: 1 / 1.428;\n  background-size: auto 100%;\n  background-repeat: no-repeat;\n  background-image: url(\"../img/common/scale/scale_num.png\");\n}\n\n#scale-digital-val-4-kg .no--0 {\n  background-position: 0% 0;\n}\n\n#scale-digital-val-4-kg .no--1 {\n  background-position: 11.2% 0;\n}\n\n#scale-digital-val-4-kg .no--2 {\n  background-position: 22.4% 0;\n}\n\n#scale-digital-val-4-kg .no--3 {\n  background-position: 33.6% 0;\n}\n\n#scale-digital-val-4-kg .no--4 {\n  background-position: 44.8% 0;\n}\n\n#scale-digital-val-4-kg .no--5 {\n  background-position: 56% 0;\n}\n\n#scale-digital-val-4-kg .no--6 {\n  background-position: 67.2% 0;\n}\n\n#scale-digital-val-4-kg .no--7 {\n  background-position: 78.4% 0;\n}\n\n#scale-digital-val-4-kg .no--8 {\n  background-position: 89.6% 0;\n}\n\n#scale-digital-val-4-kg .no--9 {\n  background-position: 100.8% 0;\n}\n\n#scale-digital-val-4-g {\n  width: 48%;\n  padding: 3% 3%;\n  border-radius: 7% / 12%;\n  text-align: right;\n}\n\n#scale-digital-val-4-g .no, #scale-digital-val-4-g .scale-digital__val .no--null, .scale-digital__val #scale-digital-val-4-g .no--null, #scale-digital-val-4-g .no--0, #scale-digital-val-4-g .no--1, #scale-digital-val-4-g .no--2, #scale-digital-val-4-g .no--3, #scale-digital-val-4-g .no--4, #scale-digital-val-4-g .no--5, #scale-digital-val-4-g .no--6, #scale-digital-val-4-g .no--7, #scale-digital-val-4-g .no--8, #scale-digital-val-4-g .no--9 {\n  width: 30%;\n  aspect-ratio: 1 / 1.428;\n  background-size: auto 100%;\n  background-repeat: no-repeat;\n  background-image: url(\"../img/common/scale/scale_num.png\");\n}\n\n#scale-digital-val-4-g .no--0 {\n  background-position: 0% 0;\n}\n\n#scale-digital-val-4-g .no--1 {\n  background-position: 11.2% 0;\n}\n\n#scale-digital-val-4-g .no--2 {\n  background-position: 22.4% 0;\n}\n\n#scale-digital-val-4-g .no--3 {\n  background-position: 33.6% 0;\n}\n\n#scale-digital-val-4-g .no--4 {\n  background-position: 44.8% 0;\n}\n\n#scale-digital-val-4-g .no--5 {\n  background-position: 56% 0;\n}\n\n#scale-digital-val-4-g .no--6 {\n  background-position: 67.2% 0;\n}\n\n#scale-digital-val-4-g .no--7 {\n  background-position: 78.4% 0;\n}\n\n#scale-digital-val-4-g .no--8 {\n  background-position: 89.6% 0;\n}\n\n#scale-digital-val-4-g .no--9 {\n  background-position: 100.8% 0;\n}\n\n.control--display {\n  position: relative;\n  padding-top: 40%;\n  width: 100%;\n  padding-bottom: 10%;\n  border-bottom: 1vmin dotted #c6c6c6;\n}\n\n@media only screen and (min-width: 1024px) {\n  .control--display {\n    border-width: 6px;\n  }\n}\n\n.control--display .nav {\n  width: 60%;\n  margin: 0 auto;\n}\n\n@media only screen and (min-width: 1024px) {\n  .control--display .nav {\n    width: 50%;\n  }\n}\n\n.control--display .nav__btn {\n  width: 100%;\n  padding: 5%;\n  color: #fff;\n  background-image: linear-gradient(#ffb23f, #ff9335);\n  border: solid 1px #ff9335;\n  border-radius: 15% / 50%;\n  border: 0;\n  outline: 0;\n  font-size: 2.8vw;\n  font-weight: 700;\n  cursor: pointer;\n}\n\n@media only screen and (min-width: 768px) {\n  .control--display .nav__btn {\n    font-size: 2.9vw;\n  }\n}\n\n@media only screen and (min-width: 1024px) {\n  .control--display .nav__btn {\n    font-size: 2.6vw;\n  }\n}\n\n@media only screen and (min-width: 1610px) {\n  .control--display .nav__btn {\n    font-size: 4.0rem;\n  }\n}\n\n.control--select {\n  position: relative;\n  width: 100%;\n  padding-top: 15%;\n}\n\n.control--select .nav {\n  margin: 0 auto;\n  width: 100%;\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin: 0 auto;\n  background-color: #e8e8e8;\n  border-radius: 12% / 54%;\n  padding: 2%;\n}\n\n@media only screen and (min-width: 1024px) {\n  .control--select .nav {\n    width: 80%;\n  }\n}\n\n.control--select .nav__btn {\n  width: 48%;\n  padding: 2% 10%;\n  border: solid 3px #ff9335;\n  border-radius: 20% / 55%;\n  outline: 0;\n  cursor: pointer;\n}\n\n.control--select .nav__btn.selected {\n  pointer-events: none;\n  color: #fff;\n  background-image: linear-gradient(#ffb23f, #ff9335);\n  border: solid 1px #ff9335;\n}\n\n.control--select .nav__btn.selected .selected {\n  display: inline-block;\n}\n\n.control--select .nav__btn.selected .unselected {\n  display: none;\n}\n\n.control--select .nav__btn.unselected {\n  pointer-events: all;\n  background-color: #fff;\n}\n\n.control--select .nav__btn.unselected .unselected {\n  display: inline-block;\n}\n\n.control--select .nav__btn.unselected .selected {\n  display: none;\n}\n\n.control--select .nav__btn img {\n  width: 60%;\n}\n","@charset \"UTF-8\";\r\n\r\n// =======================================\r\n// setting\r\n// =======================================\r\n\r\n// color\r\n$col-red: #f42733;\r\n$col-cyan: #03b8df;\r\n\r\n// font\r\n$font-base: Meiryo, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', sans-serif;\r\n\r\n\r\n// media query\r\n\r\n@mixin mq_h_max {\r\n  @media only screen and (max-height: 767px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_w_max {\r\n  @media only screen and (max-height: 1023px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_sm {\r\n  @media only screen and (min-width: 560px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_md {\r\n  @media only screen and (min-width: 768px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_lg {\r\n  @media only screen and (min-width: 1024px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_xl {\r\n  @media only screen and (min-width: 1260px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_xxl {\r\n  @media only screen and (min-width: 1610px) {\r\n    @content\r\n  }\r\n};\r\n\r\n@mixin mq_sp_portrait {\r\n  @media screen and (max-width: 850px) and (orientation: portrait) {\r\n    @content\r\n  }\r\n}\r\n\r\n\r\n@mixin mq_sp_landscape {\r\n  @media screen and (max-width: 850px) and (min-aspect-ratio: 4/3) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_sp_landscape_low_height {\r\n  @media screen and (max-width: 850px) and (min-aspect-ratio: 2/1) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_sp_landscape_xlow_height {\r\n  @media screen and (max-width: 850px) and (min-aspect-ratio: 5/2) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_low_height {\r\n  @media screen and (min-width: 851px) and (min-aspect-ratio: 4/3) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_xlow_height {\r\n  @media screen and (min-width: 851px) and (min-aspect-ratio: 2/1) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_xxlow_height {\r\n  @media screen and (min-width: 851px) and (min-aspect-ratio: 5/2) {\r\n    @content\r\n  }\r\n}\r\n\r\n@mixin mq_xxxlow_height {\r\n  @media screen and (min-width: 851px) and (min-aspect-ratio: 20/9) {\r\n    @content\r\n  }\r\n}\r\n\r\n","@charset \"UTF-8\";\r\n\r\n// ==============================================================================\r\n// module\r\n// ==============================================================================\r\n\r\n// ------------------------------------------------------------------------------\r\n// container\r\n// ------------------------------------------------------------------------------\r\n.container {\r\n  display: block;\r\n  position: relative;\r\n  margin: 0 auto;\r\n  width: 100%;\r\n}\r\n\r\n","@charset \"UTF-8\";\r\n\r\n.page-container {\r\n  position: relative;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  width: 100%;\r\n  height: 100vh;\r\n}\r\n\r\n.page {\r\n  position: relative;\r\n  width: 100%;\r\n  max-width: 1410px;\r\n  margin: 0 auto;\r\n\r\n  @include mq_lg {\r\n    width: calc(100% - 100px);\r\n  }\r\n\r\n  @include mq_xl {\r\n    width: calc(100% - 200px);\r\n  }\r\n\r\n  @include mq_xxl {\r\n    width: 1410px;\r\n  }\r\n}\r\n\r\n.main {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 100%;\r\n  z-index: 10;\r\n}\r\n\r\n.main-box {\r\n  position: relative;\r\n  height: 100%;\r\n}\r\n","@charset \"UTF-8\";\r\n\r\n// ==============================================================================\r\n// scale\r\n// ==============================================================================\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale caption\r\n// ------------------------------------------------------------------------------\r\n.scale-caption {\r\n  position: relative;\r\n  width: 16%;\r\n  aspect-ratio: 1 / 1;\r\n  padding: 2%;\r\n\r\n  @include mq_xxlow_height {\r\n    width: 14%;\r\n  }\r\n\r\n  &.unit--1kg {\r\n    .scale-caption__box.unit--1kg {\r\n      display: block;\r\n    }\r\n  }\r\n\r\n  &.unit--4kg {\r\n    .scale-caption__box.unit--4kg {\r\n      display: block;\r\n    }\r\n  }\r\n\r\n  img {\r\n    width: 100%;\r\n  }\r\n}\r\n\r\n.scale-caption__box {\r\n  display: none;\r\n}\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale boxes\r\n// ------------------------------------------------------------------------------\r\n.scale-boxes {\r\n  display: flex;\r\n  justify-self: center;\r\n  align-items: center;\r\n  margin: 0 auto;\r\n  padding: 0 4vw;\r\n\r\n  @include mq_lg {\r\n    padding: 0;\r\n  }\r\n\r\n  @include mq_xlow_height {\r\n    width: 80%;\r\n  }\r\n\r\n  @include mq_xxlow_height {\r\n    width: 70%;\r\n  }\r\n\r\n  @include mq_xxxlow_height {\r\n    width: 60%;\r\n  }\r\n}\r\n\r\n.scale-box {\r\n  position: relative;\r\n\r\n  &:first-child {\r\n    width: 55%;\r\n  }\r\n\r\n  &:last-child {\r\n    width: 45%;\r\n    padding-left: 5%;\r\n  }\r\n}\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale analog\r\n// ------------------------------------------------------------------------------\r\n.scale-analog {\r\n  position: relative;\r\n  width: 100%;\r\n  aspect-ratio: 1 / 1;\r\n  background-size: cover;\r\n  background-position: 50%;\r\n  z-index: 10;\r\n\r\n  &.unit--1kg {\r\n    background-image: url('../img/common/scale/scale_1kg_base.png');\r\n  }\r\n\r\n  &.unit--4kg {\r\n    background-image: url('../img/common/scale/scale_4kg_base.png');\r\n  }\r\n\r\n  &::before {\r\n    content: '';\r\n    display: block;\r\n    position: absolute;\r\n    width: 4%;\r\n    aspect-ratio: 1 / 1;\r\n    top: 48%;\r\n    left: 48%;\r\n    background-image: url('../img/common/scale/scale_center.png');\r\n    background-size: cover;\r\n    background-position: 50%;\r\n    z-index: 30;\r\n  }\r\n}\r\n\r\n.scale-analog__point-box {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 100%;\r\n  top: 0;\r\n  left: 0;\r\n  bottom: 0;\r\n  right: 0;\r\n  z-index: 15;\r\n  pointer-events: none;\r\n}\r\n\r\n.scale-analogo__point {\r\n  position: absolute;\r\n  background-size: cover;\r\n  background-position: 50%;\r\n  transform-origin: 50% 68.5%;\r\n  pointer-events: all;\r\n  width: 10%;\r\n  height: 66%;\r\n  top: 5%;\r\n  left: 45%;\r\n  // width: 44px;\r\n  // height: 300px;\r\n  // top: 40px;\r\n  // left: 50%;\r\n  // margin-left: -23px;\r\n  z-index: 12;\r\n  background: 50% / contain no-repeat url('../img/common/scale/scale_point.png');\r\n  cursor: pointer;\r\n}\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale digital\r\n// ------------------------------------------------------------------------------\r\n.scale-digital {\r\n  position: absolute;\r\n  top: -5%;\r\n  width: 95%;\r\n}\r\n\r\n.scale-digital__box {\r\n  padding-bottom: 0;\r\n}\r\n\r\n.scale-digital__val-box {\r\n  position: relative;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  width: 100%;\r\n  aspect-ratio: 1 / 0.261;\r\n}\r\n\r\n.scale-digital__val {\r\n  height: 100%;\r\n  border: solid 1vmin #2c9fe7;\r\n\r\n  @include mq_lg {\r\n    border-width: 10px;\r\n  }\r\n\r\n  @include mq_xlow_height {\r\n    border-width: 1vmin;\r\n  }\r\n\r\n  // @include mq_xlow_height {\r\n  //   border-width: 8px;\r\n  // }\r\n\r\n  .no {\r\n    display: inline-block;\r\n    background-repeat: no-repeat;\r\n    vertical-align: middle;\r\n  }\r\n\r\n  .no--null {\r\n    @extend .no;\r\n\r\n    width: 0;\r\n    display: none;\r\n  }\r\n}\r\n\r\n.scale-digital__unit {\r\n  position: relative;\r\n\r\n  img {\r\n    width: 100%;\r\n  }\r\n}\r\n\r\n.scale-digital__box--1kg {\r\n  @extend .scale-digital__box;\r\n\r\n  .scale-digital__unit {\r\n    width: 12%;\r\n    padding-top: 5%;\r\n    padding-left: 4%;\r\n  }\r\n}\r\n\r\n.scale-digital__box--4kg {\r\n  @extend .scale-digital__box;\r\n\r\n  .scale-digital__unit.unit-kg {\r\n    width: 18%;\r\n    padding-top: 5%;\r\n    padding-left: 2%;\r\n    padding-right: 4%;\r\n  }\r\n\r\n  .scale-digital__unit.unit-g {\r\n    width: 8%;\r\n    padding-top: 5%;\r\n    padding-left: 2%;\r\n  }\r\n}\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale number\r\n// ------------------------------------------------------------------------------\r\n#scale-digital-val-1 {\r\n  width: 64%;\r\n  padding: 2% 4%;\r\n  padding-left: 0;\r\n  border-radius: 5% / 12%;\r\n  text-align: right;\r\n\r\n  .no {\r\n    width: 24%;\r\n    aspect-ratio: 1 / 1.428;\r\n    background-size: auto 100%;\r\n    background-repeat: no-repeat;\r\n    background-image: url('../img/common/scale/scale_num.png');\r\n  }\r\n\r\n  @for $i from 0 through 9 {\r\n    .no--#{$i} {\r\n      @extend .no;\r\n\r\n      background-position: #{$i * 11.2}% 0;\r\n    }\r\n  }\r\n}\r\n\r\n#scale-digital-val-4-kg {\r\n  width: 18%;\r\n  padding: 5% 1%;\r\n  border-radius: 14% / 10%;\r\n  text-align: center;\r\n\r\n  .no {\r\n    width: 70%;\r\n    aspect-ratio: 1 / 1.428;\r\n    background-size: auto 100%;\r\n    background-repeat: no-repeat;\r\n    background-image: url('../img/common/scale/scale_num.png');\r\n  }\r\n\r\n  @for $i from 0 through 9 {\r\n    .no--#{$i} {\r\n      @extend .no;\r\n\r\n      background-position: #{$i * 11.2}% 0;\r\n    }\r\n  }\r\n}\r\n\r\n#scale-digital-val-4-g {\r\n  width: 48%;\r\n  padding: 3% 3%;\r\n  border-radius: 7% / 12%;\r\n  text-align: right;\r\n\r\n  .no {\r\n    width: 30%;\r\n    aspect-ratio: 1 / 1.428;\r\n    background-size: auto 100%;\r\n    background-repeat: no-repeat;\r\n    background-image: url('../img/common/scale/scale_num.png');\r\n  }\r\n\r\n  @for $i from 0 through 9 {\r\n    .no--#{$i} {\r\n      @extend .no;\r\n\r\n      background-position: #{$i * 11.2}% 0;\r\n    }\r\n  }\r\n}\r\n\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// scale controls\r\n// ------------------------------------------------------------------------------\r\n.control--display {\r\n  position: relative;\r\n  padding-top: 40%;\r\n  width: 100%;\r\n  padding-bottom: 10%;\r\n  border-bottom: 1vmin dotted #c6c6c6;\r\n\r\n  @include mq_lg {\r\n    border-width: 6px;\r\n  }\r\n  \r\n  .nav {\r\n    width: 60%;\r\n    margin: 0 auto;\r\n\r\n    @include mq_lg {\r\n      width: 50%;\r\n    }\r\n  }\r\n\r\n  .nav__btn {\r\n    width: 100%;\r\n    // height: 60px;\r\n    padding: 5%;\r\n    color: #fff;\r\n    background-image: linear-gradient(#ffb23f, #ff9335);\r\n    border: solid 1px #ff9335;\r\n    border-radius: 15% / 50%;\r\n    border: 0;\r\n    outline: 0;\r\n    font-size: 2.8vw;\r\n    font-weight: 700;\r\n    cursor: pointer;\r\n\r\n    @include mq_md {\r\n      font-size: 2.9vw;\r\n    }\r\n\r\n    @include mq_lg {\r\n      font-size: 2.6vw;\r\n    }\r\n\r\n    @include mq_xxl {\r\n      font-size: 4.0rem;\r\n    }\r\n  }\r\n}\r\n\r\n.control--select {\r\n  position: relative;\r\n  width: 100%;\r\n  padding-top: 15%;\r\n\r\n  .nav {\r\n    margin: 0 auto;\r\n    width: 100%;\r\n    position: relative;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    margin: 0 auto;\r\n    background-color: #e8e8e8;\r\n    border-radius: 12% / 54%;\r\n    padding: 2%;\r\n\r\n    @include mq_lg {\r\n      width: 80%;\r\n    }\r\n  }\r\n\r\n  .nav__btn {\r\n    width: 48%;\r\n    padding: 2% 10%;\r\n    border: solid 3px #ff9335;\r\n    border-radius: 20% / 55%;\r\n    outline: 0;\r\n    cursor: pointer;\r\n\r\n    &.selected {\r\n      pointer-events: none;\r\n      color: #fff;\r\n      background-image: linear-gradient(#ffb23f, #ff9335);\r\n      border: solid 1px #ff9335;\r\n\r\n      .selected {\r\n        display: inline-block;\r\n      }\r\n\r\n      .unselected {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    &.unselected {\r\n      pointer-events: all;\r\n      background-color: #fff;\r\n\r\n      .unselected {\r\n        display: inline-block;\r\n      }\r\n\r\n      .selected {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    img {\r\n      width: 60%;\r\n    }\r\n  }\r\n}\r\n\r\n"]}