{"version":3,"sources":["_basic.scss","01_06.css","_setting.scss","_module.scss","_common.scss","_clock.scss"],"names":[],"mappings":"AAMA;EACE,gBAAgB;ACLlB;;ADQA;EACE,WAAW;EACX,sBAAsB;EACtB,cAAc;EACd,iBAAiB;EACjB,8BAA8B;EAC9B,mCAAmC;EACnC,WAAW;EACX,YAAY;EACZ,gBAAgB;EAGhB,cAAc;EACd,iHEZ8G;ADKhH;;ADUA;EACE,WAAW;EACX,wBAAgB;EAAhB,gBAAgB;ACPlB;;ADUA;EACE,iHErB8G;ADchH;;AEhBA;EACE,cAAc;EACd,kBAAkB;EAClB,cAAc;EACd,WAAW;AFmBb;;AG9BA;EACE,kBAAkB;EAClB,oBAAa;EAAb,oBAAa;EAAb,aAAa;EACb,wBAAuB;MAAvB,qBAAuB;UAAvB,uBAAuB;EACvB,yBAAmB;MAAnB,sBAAmB;UAAnB,mBAAmB;EACnB,WAAW;EACX,aAAa;AHiCf;;AG9BA;EACE,yBAAyB;EACzB,iBAAiB;EACjB,uBAAuB;EACvB,cAAc;AHiChB;;ACnBE;EElBF;IAOI,aAAa;IACb,cAAc;EHmChB;AACF;;ACtCE;EENF;IAYI,cAAc;EHqChB;AACF;;AGlCA;EACE,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,sBAAsB;EACtB,WAAW;AHqCb;;AGlCA;EACE,kBAAkB;EAClB,iBAAiB;EACjB,YAAY;AHqCd;;AC9CE;EEMF;IAMI,cAAc;EHuChB;AACF;;AItEA;EACE,kBAAkB;EAClB,YAAY;EACZ,aAAa;EACb,UAAU;EACV,2DAA2D;EAC3D,sBAAsB;EACtB,wBAAwB;EACxB,WAAW;AJyEb;;AIjFA;EAWI,WAAW;EACX,cAAc;EACd,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,QAAQ;EACR,SAAS;EACT,kBAAkB;EAClB,iBAAiB;EACjB,6DAA6D;EAC7D,sBAAsB;EACtB,wBAAwB;EACxB,WAAW;AJ0Ef;;AItEA;EACE,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,MAAM;EACN,OAAO;EACP,SAAS;EACT,QAAQ;EACR,WAAW;EACX,oBAAoB;AJyEtB;;AItEA;EAGE,WAAW;AJuEb;;AIpEA;EAGE,WAAW;AJqEb;;AIlEA;EACE,kBAAkB;EAClB,sBAAsB;EACtB,wBAAwB;EACxB,kCAA0B;UAA1B,0BAA0B;EAC1B,mBAAmB;AJqErB;;AIlEA;EAGE,WAAW;EACX,aAAa;EACb,SAAS;EACT,SAAS;EACT,kBAAkB;EAClB,WAAW;EACX,gEAAgE;AJmElE;;AIhEA;EAGE,WAAW;EACX,aAAa;EACb,SAAS;EACT,SAAS;EACT,iBAAiB;EACjB,WAAW;EACX,kEAAkE;AJiEpE;;AI1DA;EACE,4CAA4C;EAC5C,0LAEqD;AJ2DvD;;AIxDA;EACE,kBAAkB;EAClB,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,UAAU;EACV,WAAW;EACX,0BAA0B;EAC1B,mBAAmB;EACnB,iBAAiB;EACjB,mBAAmB;AJ2DrB;;AIxDA;;EAEE,qBAAqB;EACrB,kBAAkB;EAClB,gBAAgB;EAChB,wDAAwD;EACxD,sBAAsB;AJ2DxB;;AIxDA;EACE,qBAAqB;EACrB,kBAAkB;EAClB,UAAU;EACV,WAAW;EACX,gBAAgB;EAChB,sBAAsB;AJ2DxB;;AIrDA;EACE,kBAAkB;EAClB,UAAU;EACV,YAAY;AJwDd;;AI3DA;EAMI,YAAY;AJyDhB;;AI/DA;EAUI,WAAW;EACX,YAAY;EACZ,aAAa;EACb,WAAW;EACX,yBHlJa;EGmJb,mBAAmB;EACnB,SAAS;EACT,UAAU;EACV,gBAAgB;EAChB,gBAAgB;EAChB,eAAe;AJyDnB","file":"01_06.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  width: calc(100% - 200px);\n  max-width: 1410px;\n  aspect-ratio: 1 / 0.765;\n  margin: 0 auto;\n}\n\n@media only screen and (min-width: 1610px) {\n  .page {\n    width: 1410px;\n    height: 1080px;\n  }\n}\n\n@media only screen and (max-height: 767px) {\n  .page {\n    margin: 0 auto;\n  }\n}\n\n.main {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background-color: #fff;\n  z-index: 10;\n}\n\n.main-box {\n  position: relative;\n  padding: 15vw 5vw;\n  height: 100%;\n}\n\n@media only screen and (min-width: 1610px) {\n  .main-box {\n    padding: 170px;\n  }\n}\n\n.clock-analog {\n  position: absolute;\n  width: 446px;\n  height: 446px;\n  top: 120px;\n  background-image: url(\"../img/common/clock/clock_base.png\");\n  background-size: cover;\n  background-position: 50%;\n  z-index: 10;\n}\n\n.clock-analog::before {\n  content: '';\n  display: block;\n  position: absolute;\n  width: 30px;\n  height: 30px;\n  top: 50%;\n  left: 50%;\n  margin-left: -15px;\n  margin-top: -15px;\n  background-image: url(\"../img/common/clock/clock_center.png\");\n  background-size: cover;\n  background-position: 50%;\n  z-index: 30;\n}\n\n.clock-analog__hand-box, .clock-analog__hand-box--hour, .clock-analog__hand-box--minute {\n  position: absolute;\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.clock-analog__hand-box--hour {\n  z-index: 20;\n}\n\n.clock-analog__hand-box--minute {\n  z-index: 15;\n}\n\n.clock-analog__hand, .clock-analog__hand--hour, .clock-analog__hand--minute {\n  position: absolute;\n  background-size: cover;\n  background-position: 50%;\n  transform-origin: 50% 100%;\n  pointer-events: all;\n}\n\n.clock-analog__hand--hour {\n  width: 39px;\n  height: 125px;\n  top: 98px;\n  left: 50%;\n  margin-left: -19px;\n  z-index: 12;\n  background-image: url(\"../img/common/clock/clock_hour_hand.png\");\n}\n\n.clock-analog__hand--minute {\n  width: 19px;\n  height: 184px;\n  top: 39px;\n  left: 50%;\n  margin-left: -9px;\n  z-index: 11;\n  background-image: url(\"../img/common/clock/clock_minute_hand.png\");\n}\n\n@font-face {\n  font-family: 'NichibunDigitalNumber-Regular';\n  src: url(\"../font/NichibunDigitalNumber-Regular.svg\") format(\"svg\"), url(\"../font/NichibunDigitalNumber-Regular.ttf\") format(\"truetype\"), url(\"../font/NichibunDigitalNumber-Regular.eot\");\n}\n\n.clock-digital {\n  position: absolute;\n  width: 400px;\n  height: 160px;\n  padding-right: 30px;\n  top: 250px;\n  right: 60px;\n  border: solid #76aede 10px;\n  border-radius: 10px;\n  text-align: right;\n  white-space: nowrap;\n}\n\n.clock-digital__hour,\n.clock-digital__minute {\n  display: inline-block;\n  position: relative;\n  font-size: 160px;\n  font-family: 'NichibunDigitalNumber-Regular', sans-serif;\n  vertical-align: middle;\n}\n\n.clock-digital__separate {\n  display: inline-block;\n  position: relative;\n  top: -20px;\n  color: #000;\n  font-size: 100px;\n  vertical-align: middle;\n}\n\n.control {\n  position: absolute;\n  top: 480px;\n  right: 155px;\n}\n\n.control .nav {\n  width: 200px;\n}\n\n.control .nav__btn {\n  width: 100%;\n  height: 60px;\n  padding: 15px;\n  color: #fff;\n  background-color: #f42733;\n  border-radius: 30px;\n  border: 0;\n  outline: 0;\n  font-size: 1.8em;\n  font-weight: 700;\n  cursor: pointer;\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_wide {\r\n  @media only screen and (min-width: 1610px) {\r\n    @content\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  width: calc(100% - 200px);\r\n  max-width: 1410px;\r\n  aspect-ratio: 1 / 0.765;\r\n  margin: 0 auto;\r\n\r\n  @include mq_wide {\r\n    width: 1410px;\r\n    height: 1080px;\r\n  }\r\n\r\n  @include mq_h_max {\r\n    margin: 0 auto;\r\n  };\r\n}\r\n\r\n.main {\r\n  position: relative;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: #fff;\r\n  z-index: 10;\r\n}\r\n\r\n.main-box {\r\n  position: relative;\r\n  padding: 15vw 5vw;\r\n  height: 100%;\r\n\r\n  @include mq_wide {\r\n    padding: 170px;\r\n  }\r\n}\r\n","@charset \"UTF-8\";\r\n\r\n// ==============================================================================\r\n// clock\r\n// ==============================================================================\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// clock analog\r\n// ------------------------------------------------------------------------------\r\n\r\n.clock-analog {\r\n  position: absolute;\r\n  width: 446px;\r\n  height: 446px;\r\n  top: 120px;\r\n  background-image: url('../img/common/clock/clock_base.png');\r\n  background-size: cover;\r\n  background-position: 50%;\r\n  z-index: 10;\r\n\r\n  &::before {\r\n    content: '';\r\n    display: block;\r\n    position: absolute;\r\n    width: 30px;\r\n    height: 30px;\r\n    top: 50%;\r\n    left: 50%;\r\n    margin-left: -15px;\r\n    margin-top: -15px;\r\n    background-image: url('../img/common/clock/clock_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.clock-analog__hand-box {\r\n  position: absolute;\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.clock-analog__hand-box--hour {\r\n  @extend .clock-analog__hand-box;\r\n\r\n  z-index: 20;\r\n}\r\n\r\n.clock-analog__hand-box--minute {\r\n  @extend .clock-analog__hand-box;\r\n\r\n  z-index: 15;\r\n}\r\n\r\n.clock-analog__hand {\r\n  position: absolute;\r\n  background-size: cover;\r\n  background-position: 50%;\r\n  transform-origin: 50% 100%;\r\n  pointer-events: all;\r\n}\r\n\r\n.clock-analog__hand--hour {\r\n  @extend .clock-analog__hand;\r\n\r\n  width: 39px;\r\n  height: 125px;\r\n  top: 98px;\r\n  left: 50%;\r\n  margin-left: -19px;\r\n  z-index: 12;\r\n  background-image: url('../img/common/clock/clock_hour_hand.png');\r\n}\r\n\r\n.clock-analog__hand--minute {\r\n  @extend .clock-analog__hand;\r\n\r\n  width: 19px;\r\n  height: 184px;\r\n  top: 39px;\r\n  left: 50%;\r\n  margin-left: -9px;\r\n  z-index: 11;\r\n  background-image: url('../img/common/clock/clock_minute_hand.png');\r\n}\r\n\r\n\r\n// ------------------------------------------------------------------------------\r\n// clock degital\r\n// ------------------------------------------------------------------------------\r\n@font-face {\r\n  font-family: 'NichibunDigitalNumber-Regular';\r\n  src: url('../font/NichibunDigitalNumber-Regular.svg') format('svg'),\r\n       url('../font/NichibunDigitalNumber-Regular.ttf') format('truetype'),\r\n       url('../font/NichibunDigitalNumber-Regular.eot');\r\n}\r\n\r\n.clock-digital {\r\n  position: absolute;\r\n  width: 400px;\r\n  height: 160px;\r\n  padding-right: 30px;\r\n  top: 250px;\r\n  right: 60px;\r\n  border: solid #76aede 10px;\r\n  border-radius: 10px;\r\n  text-align: right;\r\n  white-space: nowrap;\r\n}\r\n\r\n.clock-digital__hour,\r\n.clock-digital__minute {\r\n  display: inline-block;\r\n  position: relative;\r\n  font-size: 160px;\r\n  font-family: 'NichibunDigitalNumber-Regular', sans-serif;\r\n  vertical-align: middle;\r\n}\r\n\r\n.clock-digital__separate {\r\n  display: inline-block;\r\n  position: relative;\r\n  top: -20px;\r\n  color: #000;\r\n  font-size: 100px;\r\n  vertical-align: middle;\r\n}\r\n\r\n// ------------------------------------------------------------------------------\r\n// control\r\n// ------------------------------------------------------------------------------\r\n.control {\r\n  position: absolute;\r\n  top: 480px;\r\n  right: 155px;\r\n  \r\n  .nav {\r\n    width: 200px;\r\n  }\r\n\r\n  .nav__btn {\r\n    width: 100%;\r\n    height: 60px;\r\n    padding: 15px;\r\n    color: #fff;\r\n    background-color: $col-red;\r\n    border-radius: 30px;\r\n    border: 0;\r\n    outline: 0;\r\n    font-size: 1.8em;\r\n    font-weight: 700;\r\n    cursor: pointer;\r\n  }\r\n}\r\n\r\n"]}