{"version":3,"sources":["webpack:///./src/templates/machines/laser-toning-page.tsx","webpack:///./src/templates/dullness/dullness-ranking-page.tsx"],"names":["LaserToningPageTemplate","_ref","title","content","contentComponent","React","createElement","Fragment","className","Link","to","laserToningData","length","duration","map","item","index","time_table","table_title","text","tabelItem","table_contents","contentsItem","caution","expect_actions","lables","operating_description","contents","treatment_interval","flow_treatment","description","treatment_pain","downtime","aftercare","precaution","onClick","onPressToMoveScreenWithQuery","hash","navigate","window","location","DullnessRankingPageTemplate","FrecklesRankingPageTemplate","LaserToningPage","_ref2","data","markdownRemark","post","Layout","frontmatter","SharePartsOfTroublePagePreview","SharePlacesPageTemplate","SharePickupNewsPageTemplate","ShareHistoryPageTemplate","ShareInfomationPageTemplate","dullnessData","key","v4","rank_name","rank_title","link","label","DullnessRankingPage"],"mappings":"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","file":"component---src-templates-machines-laser-toning-page-tsx-90f8b4ef8ce04261b388.js","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { graphql, Link } from \"gatsby\";\nimport { navigate } from \"@reach/router\";\nimport Layout from \"../../components/Layout\";\nimport Content, { HTMLContent } from \"../../components/Content\";\n\n// share\nimport SharePartsOfTroublePagePreview from \"./../share-parts-of-trouble-page\";\nimport SharePlacesPageTemplate from \"./../share-places-page\";\nimport SharePickupNewsPageTemplate from \"./../share-pickup-news-page\";\nimport ShareHistoryPageTemplate from \"./../share-history-page\";\nimport ShareInfomationPageTemplate from \"./../share-infomation-page\";\nimport { DullnessRankingPageTemplate } from \"../dullness/dullness-ranking-page\";\nimport { FrecklesRankingPageTemplate } from \"../freckles/freckles-ranking-page\";\n\n// data\nimport laserToningData from \"./../../data/machines/laser_toning.json\";\n\nconst onPressToMoveScreenWithQuery = hash => {\n  navigate(`/beauty-medical-treatment/price${hash}`);\n};\n\nexport const LaserToningPageTemplate = ({\n  title,\n  content,\n  contentComponent\n}) => {\n  return (\n    <>\n      <div className=\"c-bread\">\n        <div className=\"c-bread__inner\">\n          <div className=\"c-bread__item\">\n            <Link className=\"c-bread__link\" to={\"/\"}>\n              <div className=\"c-bread__text\">トップ</div>\n            </Link>\n          </div>\n          <div className=\"c-bread__item\">\n            <div className=\"c-bread__text\">\n              {laserToningData[0] && laserToningData[0].title.length\n                ? laserToningData[0].title\n                : null}\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <section className=\"l-section-lv2 l-main-media-hero\">\n        <div className=\"l-main-media-hero__inner\">\n          <div className=\"c-simple-title -small\">\n            <h2 className=\"c-simple-title__text\">\n              {laserToningData[0] && laserToningData[0].title.length\n                ? laserToningData[0].title\n                : null}\n            </h2>\n          </div>\n\n          {laserToningData[0] && laserToningData[0].duration.length\n            ? laserToningData[0].duration.map((item, index) => {\n                return (\n                  <>\n                    <section>\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <div className=\"c-tile2\">\n                        <div className=\"c-tile2__inner\">\n                          <div className=\"c-tile2__head\">\n                            {item &&\n                            item.time_table[index].table_title[index].text\n                              .length\n                              ? item.time_table[index].table_title.map(\n                                  tabelItem => {\n                                    return (\n                                      <div className=\"c-tile2__head__item\">\n                                        <p className=\"c-tile2__head__text\">\n                                          {tabelItem.text}\n                                        </p>\n                                      </div>\n                                    );\n                                  }\n                                )\n                              : null}\n                          </div>\n                          <div className=\"c-tile2__body\">\n                            <div className=\"c-tile2__body__row\">\n                              {item &&\n                              item.time_table[index].table_contents[index].text\n                                .length\n                                ? item.time_table[index].table_contents.map(\n                                    contentsItem => {\n                                      return (\n                                        <div className=\"c-tile2__body__item\">\n                                          <p className=\"c-tile2__body__text\">\n                                            {contentsItem.text}\n                                          </p>\n                                        </div>\n                                      );\n                                    }\n                                  )\n                                : null}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n\n                      {item && item.caution.length\n                        ? item.caution.map(item => {\n                            return (\n                              <div className=\"c-text u-pc-mt20 u-sp-mt10\">\n                                {item.text}\n                              </div>\n                            );\n                          })\n                        : null}\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].expect_actions.length\n            ? laserToningData[0].expect_actions.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <div className=\"c-tile3\">\n                        <div className=\"c-tile3__inner\">\n                          <div className=\"c-tile3__body\">\n                            <div className=\"c-tile3__body__row\">\n                              {item.lables.map(item => {\n                                return (\n                                  <div className=\"c-tile3__body__item\">\n                                    <p className=\"c-tile3__body__text\">\n                                      {item.text}\n                                    </p>\n                                  </div>\n                                );\n                              })}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].operating_description.length\n            ? laserToningData[0].operating_description.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].treatment_interval.length\n            ? laserToningData[0].treatment_interval.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].flow_treatment.length\n            ? laserToningData[0].flow_treatment.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <div className=\"c-flow-treatment\">\n                        <div className=\"c-flow-treatment__inner\">\n                          {item.contents.map((item, index) => {\n                            return (\n                              <div className=\"c-flow-treatment__item\">\n                                <div className=\"c-flow-treatment__title\">\n                                  {item.title}\n                                </div>\n                                <p className=\"c-flow-treatment__description\">\n                                  {item.description}\n                                </p>\n                                <div className=\"c-flow-treatment__circle\"></div>\n                              </div>\n                            );\n                          })}\n                        </div>\n                      </div>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].treatment_pain.length\n            ? laserToningData[0].treatment_pain.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].downtime.length\n            ? laserToningData[0].downtime.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].aftercare.length\n            ? laserToningData[0].aftercare.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          {laserToningData[0] && laserToningData[0].precaution.length\n            ? laserToningData[0].precaution.map(item => {\n                return (\n                  <>\n                    <section className=\"u-pc-mt100 u-sp-mt60\">\n                      <div className=\"c-border-simple-title\">\n                        <h3 className=\"c-border-simple-title__text\">\n                          {item.title}\n                        </h3>\n                      </div>\n\n                      <ul className=\"c-text-list\">\n                        {item.contents.map(item => {\n                          return (\n                            <li className=\"c-text-list__item\">{item.text}</li>\n                          );\n                        })}\n                      </ul>\n                    </section>\n                  </>\n                );\n              })\n            : null}\n\n          <div className=\"u-txt-c u-pc-mt100 u-sp-mt60\">\n            <div\n              className=\"c-border-button -arrow\"\n              onClick={() =>\n                onPressToMoveScreenWithQuery(\"#female-laser-toning\")\n              }\n            >\n              <p className=\"c-border-button__text\">料金を確認</p>\n            </div>\n          </div>\n\n          {typeof window !== \"undefined\" &&\n            window.location.hash === \"#prev-dullness-screen\" && (\n              <>\n                <div className=\"c-simple-title -small u-pc-mt100 u-sp-mt50\">\n                  <h2 className=\"c-simple-title__text\">\n                    肝斑、くすみ施術ランキング\n                  </h2>\n                </div>\n\n                <DullnessRankingPageTemplate />\n              </>\n            )}\n\n          {typeof window !== \"undefined\" &&\n            window.location.hash === \"#prev-freckles-screen\" && (\n              <>\n                <div className=\"c-simple-title -small u-pc-mt100 u-sp-mt50\">\n                  <h2 className=\"c-simple-title__text\">\n                    小さなしみ(雀卵斑等)施術ランキング\n                  </h2>\n                </div>\n\n                <FrecklesRankingPageTemplate />\n              </>\n            )}\n        </div>\n      </section>\n    </>\n  );\n};\n\nLaserToningPageTemplate.propTypes = {\n  title: PropTypes.string\n};\n\nconst LaserToningPage = ({ data }) => {\n  const { markdownRemark: post } = data;\n\n  return (\n    <Layout>\n      <LaserToningPageTemplate title={post.frontmatter.title} />\n      <SharePartsOfTroublePagePreview />\n      <SharePlacesPageTemplate />\n      <SharePickupNewsPageTemplate />\n      <ShareHistoryPageTemplate />\n      <ShareInfomationPageTemplate />\n    </Layout>\n  );\n};\n\nLaserToningPage.propTypes = {\n  data: PropTypes.object.isRequired,\n  title: PropTypes.string\n};\n\nexport default LaserToningPage;\n\nexport const laserToningPageQuery = graphql`\n  query LaserToningPage($id: String!) {\n    markdownRemark(id: { eq: $id }) {\n      html\n      frontmatter {\n        title\n      }\n    }\n  }\n`;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { graphql, Link } from \"gatsby\";\nimport { navigate } from \"@reach/router\";\nimport { v4 } from \"uuid\";\nimport Layout from \"../../components/Layout\";\nimport Content, { HTMLContent } from \"../../components/Content\";\n\n// share\nimport SharePartsOfTroublePagePreview from \"./../share-parts-of-trouble-page\";\nimport SharePlacesPageTemplate from \"./../share-places-page\";\nimport SharePickupNewsPageTemplate from \"./../share-pickup-news-page\";\nimport ShareHistoryPageTemplate from \"./../share-history-page\";\nimport ShareInfomationPageTemplate from \"./../share-infomation-page\";\n\n// data\nimport dullnessData from \"./../../data/rankings/dullness.json\";\n\nconst screenName = \"dullness\";\n\nconst onPressToMoveScreenWithQuery = link => {\n  navigate(`/machines/${link}#prev-${screenName}-screen`);\n};\n\nexport const DullnessRankingPageTemplate = ({\n  title,\n  content,\n  contentComponent\n}) => {\n  return (\n    <>\n      {dullnessData[0].contents.map(item => {\n        return (\n          <section className=\"l-ranking-hero\" key={v4()}>\n            <div className={`c-ranking-title -${item.rank_name}`}>\n              <h3 className=\"c-ranking-title__text\">{item.rank_title}</h3>\n            </div>\n            <p className=\"u-text u-border-t-gray\">{item.description}</p>\n            <div className=\"u-txt-c u-pc-mt60 u-sp-mt30\">\n              <div\n                className=\"c-border-button -arrow\"\n                onClick={() => onPressToMoveScreenWithQuery(item.label)}\n              >\n                <p className=\"c-border-button__text\">詳細を確認</p>\n              </div>\n            </div>\n          </section>\n        );\n      })}\n    </>\n  );\n};\n\nDullnessRankingPageTemplate.propTypes = {\n  title: PropTypes.string\n};\n\nconst DullnessRankingPage = ({ data }) => {\n  const { markdownRemark: post } = data;\n\n  return (\n    <Layout>\n      <div className=\"c-bread\">\n        <div className=\"c-bread__inner\">\n          <div className=\"c-bread__item\">\n            <Link className=\"c-bread__link\" to={\"/\"}>\n              <div className=\"c-bread__text\">トップ</div>\n            </Link>\n          </div>\n          <div className=\"c-bread__item\">\n            <div className=\"c-bread__text\">\n              {dullnessData[0].title}施術ランキング\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <section className=\"l-section-lv2 l-main-media-hero\">\n        <div className=\"l-main-media-hero__inner\">\n          <div className=\"c-simple-title\">\n            <h2 className=\"c-simple-title__text\">\n              {dullnessData[0].title}施術ランキング\n            </h2>\n          </div>\n          <DullnessRankingPageTemplate title={post.frontmatter.title} />\n        </div>\n      </section>\n\n      <SharePartsOfTroublePagePreview />\n      <SharePlacesPageTemplate />\n      <SharePickupNewsPageTemplate />\n      <ShareHistoryPageTemplate />\n      <ShareInfomationPageTemplate />\n    </Layout>\n  );\n};\n\nDullnessRankingPage.propTypes = {\n  data: PropTypes.object.isRequired,\n  title: PropTypes.string\n};\n\nexport default DullnessRankingPage;\n\nexport const dullnessRankingPageQuery = graphql`\n  query DullnessRankingPage($id: String!) {\n    markdownRemark(id: { eq: $id }) {\n      html\n      frontmatter {\n        title\n      }\n    }\n  }\n`;\n"],"sourceRoot":""}