{"version":3,"sources":["webpack:///./src/images/gatsby-image/v2-work-page/fluid-images.js","webpack:///./src/constants-v2/page-contents/work-info.js","webpack:///./src/components/work-v2/index.jsx","webpack:///./src/images/gatsby-image/work-detail-page/fluid-images.js","webpack:///./src/pages/works/work-product-development.jsx"],"names":["WorkFluidImages","image","useStaticQuery","childImageSharp","fluid","workInfo","link","subtitle","title","description","text","buttonlabel","Root","styled","div","ListItemBox","ListItemBoxLink","Link","ListItemBoxNoLink","ListItemBoxPic","Img","props","addHover","ListItemTitle","p","ListItemDescription","colorPaletteV2","blue","ListItemText","CaptionLeftAlign","Title","h2","TitleInner","WorksGridList","ButtonM","ButtonStr","span","Works","className","map","work","index","key","to","join","WorkDetailFluidImages","contentFontH","h1","font","line","h3","h4","BodyWrapper","CaptionRightAlign","TopAttention","WorkContentWrapper","EyeCatchPic","WorkTitle","WorkTags","WorkTagsItem","WorksOuter","WorkDescriptionWrapper","WorkParagraph","WorkBlockImagePC","WorkBlockImageSP","WorkProductDevelopment","pageTitle","pagesV2","works","path"],"mappings":"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","file":"component---src-pages-works-work-product-development-jsx-c5d48a073bf4cdee0b43.js","sourcesContent":["import { useStaticQuery, graphql } from 'gatsby';\n\nconst WorkFluidImages = image => {\n  const data = useStaticQuery(graphql`\n    query {\n      workproductevelopment: file(\n        relativePath: { eq: \"v2-work/productevelopment@2x.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 448, maxHeight: 310) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n      productionManagement: file(\n        relativePath: { eq: \"v2-work/productionManagement@2x.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 448, maxHeight: 310) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n      valveMaintenanceSystem: file(\n        relativePath: { eq: \"v2-work/valveMaintenanceSystem@2x.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 448, maxHeight: 310) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n      dxsolution: file(relativePath: { eq: \"v2-work/dxsolution@2x.png\" }) {\n        childImageSharp {\n          fluid(maxWidth: 448, maxHeight: 310) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n      dxHumanIntroduce: file(\n        relativePath: { eq: \"v2-work/dxHumanIntroduce@2x.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 448, maxHeight: 310) {\n            ...GatsbyImageSharpFluid\n          }\n        }\n      }\n    }\n  `);\n\n  return data[image].childImageSharp.fluid;\n};\n\nexport default WorkFluidImages;\n","const workInfo = [\n  {\n    image: 'workproductevelopment',\n    link: 'work-product-development',\n    subtitle: null,\n    title: [\n      '鋼板の生産ラインを自動化！',\n      '熟練の匠にしかできない神技。',\n      '自動制御システムで現場の負担を軽減',\n    ],\n    description: [\n      '重厚長大な産業の現場で活躍する',\n      '匠の「熟練の技」をデータ化し、AIモデルを生成。',\n    ],\n    text:\n      '安全性の向上や、後継者不足の解消、現場の方々の負担の軽減に繋がるようなプロダクトを、パートナーと共に作っています。',\n    buttonlabel: '詳しく見る',\n  },\n  {\n    image: 'productionManagement',\n    link: 'production-management-system',\n    subtitle: null,\n    title: [\n      '需要予測から生産計画を立案！',\n      '資材発注と生産実績計上も自動で行い、',\n      '生産工程を丸ごと効率化。',\n    ],\n    description: ['老舗豆腐メーカーの', '生産工程をDXするシステムを開発中'],\n    text:\n      '安全性の向上や、後継者不足の解消、現場の方々の負担の軽減に繋がるようなプロダクトを、パートナーと共に作っています。',\n    buttonlabel: 'Comming Soon...',\n  },\n  {\n    image: 'valveMaintenanceSystem',\n    link: 'valve-maintenance-system',\n    subtitle: null,\n    title: ['ハードとソフトが融合！', '超高圧バルブメンテナンスシステム'],\n    description: [\n      '超高圧バルブの診断装置とWebシステムが融合。',\n      '次世代メンテナンスシステムを継続開発中！',\n    ],\n    text:\n      '発電所などで使用する超高圧バルブを製造する老舗企業様とのプロジェクト。（システム開発＆人材育成）',\n    buttonlabel: '詳しく見る',\n  },\n  {\n    image: 'dxHumanIntroduce',\n    link: 'dx-humanIntroduce',\n    subtitle: null,\n    title: ['人材を弊社でお預かりして', 'DX技術者（エンジニア）として育成！'],\n    description: [\n      '老舗企業様から人材をお預かりし、人材育成中。',\n      '次世代メンテナンスシステムを継続開発中！',\n    ],\n    text:\n      'システム開発を通して、広範なIT技術や、新しいワークスタイルを身に付けて、社内に持ち帰っていただきます。',\n    buttonlabel: '詳しく見る',\n  },\n  {\n    image: 'dxsolution',\n    link: 'dx-solution',\n    subtitle: 'Online Merges With Offline',\n    title: ['OMO実現を見据えて', '顧客との接点を生むシステム開発'],\n    description: [\n      '老舗の釣り具販売企業様の、',\n      'WEBシステム＆SNSモバイルアプリの開発',\n    ],\n    text:\n      'ファンコミュニティの形成を通じた、企業ブランドと顧客接点の変革のためのシステムを制作しました。',\n    buttonlabel: '詳しく見る',\n  },\n];\n\nexport default workInfo;\n","import React from 'react';\nimport styled from 'styled-components';\nimport { Link } from 'gatsby';\nimport Img from 'gatsby-image';\nimport WorkFluidImages from '../../images/gatsby-image/v2-work-page/fluid-images';\nimport workInfo from '../../constants-v2/page-contents/work-info';\nimport '../../styles/foundation-v2.css';\nimport colorPaletteV2 from '../../styles/color-palette-v2';\n\nconst Root = styled.div``;\n\nconst ListItemBox = styled.div`\n  width: 100%;\n`;\nconst ListItemBoxLink = styled(Link)`\n  cursor: pointer;\n`;\n\nconst ListItemBoxNoLink = styled.div``;\n\nconst ListItemBoxPic = styled(Img)`\n  background: no-repeat center;\n  border: 0;\n  background-size: cover;\n  &:hover {\n    opacity: ${props => (props.addHover ? '0.7' : 'none')};\n  }\n  transition: 0.4s all;\n  @media (max-width: 1023px) {\n    width: 100%;\n    height: 237px;\n    height: 237px;\n  }\n\n  @media (min-width: 1024px) {\n    width: 100%;\n    height: 343px;\n    height: 343px;\n  }\n`;\n\nconst ListItemTitle = styled.p`\n  display: inline-block;\n  white-space: pre-wrap;\n  margin-top: 18px;\n  margin-top: 18px;\n  font-weight: 600;\n  @media (max-width: 1023px) {\n    font-size: 19px;\n    font-size: 19px;\n    line-height: 1.5;\n  }\n  @media (min-width: 1024px) {\n    font-size: 24px;\n    font-size: 24px;\n    line-height: 1.5;\n  }\n  @media (max-width: 742px) {\n    font-size: 18px;\n    font-size: 18px;\n    line-height: 1.5;\n  }\n  @media (max-width: 632px) {\n    font-size: 15px;\n    font-size: 15px;\n    line-height: 1.5;\n  }\n\n  @media (max-width: 591px) {\n    font-size: 17px;\n    font-size: 17px;\n    line-height: 1.5;\n  }\n`;\n\nconst ListItemDescription = styled.p`\n  display: inline-block;\n  white-space: pre-wrap;\n  padding: 0px 8px;\n  margin-top: 18px;\n  border-left: solid 6px ${colorPaletteV2.blue};\n  color: ${colorPaletteV2.blue};\n  font-weight: 400;\n\n  @media (max-width: 1023px) {\n    font-size: 15px;\n    font-size: 15px;\n    line-height: 22.5px;\n    line-height: 22.5px;\n  }\n  @media (min-width: 1024px) {\n    font-size: 16px;\n    font-size: 16px;\n    line-height: 1.5;\n    line-height: 1.5;\n  }\n  @media (max-width: 742px) {\n    font-size: 13px;\n    font-size: 13px;\n    line-height: 1.5;\n    line-height: 1.5;\n  }\n  @media (max-width: 591px) {\n    font-size: 16px;\n    font-size: 16px;\n    line-height: 1.5;\n    line-height: 1.5;\n  }\n`;\n\nconst ListItemText = styled.p`\n  font-size: 16px;\n  font-size: 16px;\n  line-height: 28.8px;\n  line-height: 28.8px;\n  margin-top: 22px;\n  font-weight: 400;\n`;\n\nconst CaptionLeftAlign = styled.div`\n  display: flex;\n  align-items: baseline;\n  @media (max-width: 1023px) {\n    margin-bottom: 32px;\n  }\n  @media (min-width: 1024px) {\n    margin-bottom: 56px;\n  }\n`;\n\nconst Title = styled.h2`\n  margin-left: 20px;\n  margin-left: 20px;\n  display: inline-block;\n  text-transform: uppercase;\n  @media (max-width: 1023px) {\n    font-size: 20px;\n    font-size: 20px;\n  }\n  @media (min-width: 1024px) {\n    font-size: 24px;\n    font-size: 24px;\n  }\n`;\n\nconst TitleInner = styled.div`\n  display: flex;\n`;\n\nconst WorksGridList = styled.div`\n  display: grid;\n  gap: 2vw;\n  @media (max-width: 1023px) {\n    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n    column-gap: 2vw;\n    row-gap: 42px;\n    row-gap: 42px;\n  }\n  @media (min-width: 1024px) {\n    grid-template-columns: repeat(2, minmax(288px, 1fr));\n    column-gap: 3vw;\n    row-gap: 40px;\n    row-gap: 40px;\n  }\n`;\n\nconst ButtonM = styled(Link)`\n  margin-top: 16px;\n`;\nconst ButtonStr = styled.span`\n  line-height: 1;\n`;\n\nconst Works = () => {\n  return (\n    <Root>\n      <div>\n        <CaptionLeftAlign>\n          <h1 className=\"section_title_left\">実績紹介</h1>\n          <Title>\n            <TitleInner>\n              <p className=\"grad_txt section_title_right\">works</p>\n            </TitleInner>\n          </Title>\n        </CaptionLeftAlign>\n      </div>\n      <div>\n        <WorksGridList>\n          {workInfo.map((work, index) => {\n            return (\n              <ListItemBox key={index}>\n                {work.link === 'production-management-system' ? (\n                  <ListItemBoxNoLink>\n                    <ListItemBoxPic fluid={WorkFluidImages(work.image)} />\n                  </ListItemBoxNoLink>\n                ) : (\n                  <ListItemBoxLink to={`/works/${work.link}`}>\n                    <ListItemBoxPic\n                      fluid={WorkFluidImages(work.image)}\n                      addHover\n                    />\n                  </ListItemBoxLink>\n                )}\n                <ListItemTitle>{work.title.join('\\n')}</ListItemTitle>\n                <ListItemDescription>\n                  {work.description.join('\\n')}\n                </ListItemDescription>\n                <ListItemText>{work.text}</ListItemText>\n                {work.buttonlabel === 'Comming Soon...' ? (\n                  <ButtonM className=\"comming_soon_button sizeM\">\n                    <ButtonStr className=\"comming_soon_button_inside\">\n                      {work.buttonlabel}\n                    </ButtonStr>\n                  </ButtonM>\n                ) : (\n                  <ButtonM\n                    className=\"grad1_border_button sizeM\"\n                    to={`/works/${work.link}`}\n                  >\n                    <ButtonStr className=\"grad1_border_button_inside white\">\n                      {work.buttonlabel}\n                    </ButtonStr>\n                  </ButtonM>\n                )}\n              </ListItemBox>\n            );\n          })}\n        </WorksGridList>\n      </div>\n    </Root>\n  );\n};\nexport default Works;\n","import { useStaticQuery, graphql } from 'gatsby';\n\nconst WorkDetailFluidImages = image => {\n  const data = useStaticQuery(graphql`\n    query {\n      workproductDevelopmentDescktop01: file(\n        relativePath: { eq: \"v2-work-detail/productDevelopment_img_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 608, maxHeight: 320) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      workproductDevelopmentMobile01: file(\n        relativePath: { eq: \"v2-work-detail/productDevelopment_img_sp_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 360, maxHeight: 238) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      workproductDevelopmentDescktop02: file(\n        relativePath: { eq: \"v2-work-detail/productDevelopment_img_02.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 608, maxHeight: 320) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      workproductDevelopmentMobile02: file(\n        relativePath: { eq: \"v2-work-detail/productDevelopment_img_sp_02.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 360, maxHeight: 238) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n\n      valveMaintenanceSystemDescktop01: file(\n        relativePath: { eq: \"v2-work-detail/valveMaintenanceSystem_img_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 608, maxHeight: 320) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      valveMaintenanceSystemMobile01: file(\n        relativePath: {\n          eq: \"v2-work-detail/valveMaintenanceSystem_img_sp_01.png\"\n        }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 360, maxHeight: 238) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n\n      dxsolutionDescktop01: file(\n        relativePath: { eq: \"v2-work-detail/dxsolution_img_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 608, maxHeight: 320) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      dxsolutionMobile01: file(\n        relativePath: { eq: \"v2-work-detail/dxsolution_img_sp_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 360, maxHeight: 238) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n\n      dxHumanIntroduceDescktop01: file(\n        relativePath: { eq: \"v2-work-detail/dxHumanIntroduce_img_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 608, maxHeight: 320) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n      dxHumanIntroduceMobile01: file(\n        relativePath: { eq: \"v2-work-detail/dxHumanIntroduce_img_sp_01.png\" }\n      ) {\n        childImageSharp {\n          fluid(maxWidth: 360, maxHeight: 238) {\n            ...GatsbyImageSharpFluid_withWebp\n            ...GatsbyImageSharpFluidLimitPresentationSize\n          }\n        }\n      }\n    }\n  `);\n\n  return data[image].childImageSharp.fluid;\n};\n\nexport default WorkDetailFluidImages;\n","import React from 'react';\nimport styled from 'styled-components';\nimport { Link } from 'gatsby';\nimport Img from 'gatsby-image';\nimport PageRoot from '../../components/common-components/templates/page-root-v2';\nimport Works from '../../components/work-v2/index';\nimport colorPaletteV2 from '../../styles/color-palette-v2';\nimport '../../styles/foundation-v2.css';\nimport WorkFluidImages from '../../images/gatsby-image/v2-work-page/fluid-images';\nimport WorkDetailFluidImages from '../../images/gatsby-image/work-detail-page/fluid-images';\nimport pagesV2 from '../../constants-v2/pages-v2';\nimport SEOHeaderV2 from '../../components/common-components/templates/page-root-v2/seo-v2';\n\nconst wpContentSideMarginSp = 2.4;\n\nconst captionWidthPc = '608px';\nconst captionWidthSp = `calc(100% - ${wpContentSideMarginSp * 2}px)`;\n\nconst contentFontH = {\n  sp: {\n    h1: {\n      font: '24px',\n      line: '36px',\n    },\n    h2: {\n      font: '24px',\n      line: '36px',\n    },\n    h3: {\n      font: '21px',\n      line: '31.5px',\n    },\n    h4: {\n      font: '17px',\n      line: '27px',\n    },\n  },\n  pc: {\n    h1: {\n      font: '24px',\n      line: '34.75px',\n    },\n    h2: {\n      font: '24px',\n      line: '34.75px',\n    },\n    h3: {\n      font: '18px',\n      line: '24.06px',\n    },\n    h4: {\n      font: '16px',\n      line: '23.17px',\n    },\n  },\n};\n\nconst Root = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  min-height: 60vh;\n`;\n\nconst BodyWrapper = styled.div`\n  z-index: 1;\n  margin-bottom: 160px;\n  @media (max-width: 1023px) {\n    width: 100%;\n    margin-bottom: 100px;\n  }\n`;\n\nconst CaptionRightAlign = styled(Link)`\n  display: flex;\n  align-items: center;\n  width: 110px;\n  margin: 0 0 24px auto;\n  @media (max-width: 1023px) {\n    margin-bottom: 18px;\n  }\n  @media (min-width: 1024px) {\n    margin-bottom: 24px;\n  }\n`;\n\nconst TopAttention = styled.h2`\n  font-weight: 400;\n  color: ${colorPaletteV2.blue};\n  @media (max-width: 1023px) {\n    font-size: 16px;\n    line-height: 16px;\n  }\n  @media (min-width: 1024px) {\n    font-size: 16px;\n    line-height: 16px;\n    margin-left: 4px;\n  }\n`;\n\nconst WorkContentWrapper = styled.div`\n  @media (min-width: 1024px) {\n    width: ${captionWidthPc};\n  }\n`;\n\nconst EyeCatchPic = styled(Img)`\n  border: 0;\n  background-size: cover;\n  @media (max-width: 1023px) {\n    width: ${captionWidthSp};\n    height: 320px;\n    margin: 0 auto 24px;\n  }\n  @media (min-width: 1024px) {\n    width: ${captionWidthPc};\n    height: 420px;\n    margin-bottom: 28px;\n  }\n  @media (max-width: 640px) {\n    height: 210px;\n  }\n`;\n\nconst WorkTitle = styled.h1`\n  font-size: 24px;\n  line-height: 34.75px;\n  font-weight: 700;\n  @media (max-width: 1023px) {\n    margin-bottom: 12px;\n  }\n  @media (min-width: 1024px) {\n    margin-bottom: 14px;\n  }\n`;\n\nconst WorkTags = styled.div`\n  @media (max-width: 1023px) {\n    display: block;\n    line-height: 28.8px;\n  }\n  @media (min-width: 1024px) {\n    margin-bottom: 40px;\n    margin-bottom: 40px;\n  }\n`;\n\nconst WorkTagsItem = styled.span`\n  font-size: 16px;\n  color: ${colorPaletteV2.blue};\n  display: inline;\n  margin-right: 5px;\n  cursor: pointer;\n  white-space: nowrap;\n  &:hover {\n    text-decoration: underline;\n  }\n`;\n\nconst WorksOuter = styled.div`\n  margin-bottom: 100px;\n`;\n\nconst WorkDescriptionWrapper = styled.div`\n  font-size: 16px;\n  font-size: 16px;\n  line-height: 28.8px;\n  line-height: 28.8px;\n\n  & h2 {\n    padding: 2px 8px;\n    border-left: solid 6px ${colorPaletteV2.blue};\n    margin-top: 20px;\n    margin-top: 20px;\n    margin-bottom: 20px;\n    margin-bottom: 20px;\n\n    @media (max-width: 1023px) {\n      font-size: ${contentFontH.sp.h2.font};\n      line-height: ${contentFontH.sp.h2.line};\n    }\n    @media (min-width: 1024px) {\n      font-size: ${contentFontH.pc.h2.font};\n      line-height: ${contentFontH.pc.h2.line};\n    }\n  }\n`;\n\nconst WorkParagraph = styled.p`\n  font-size: 16px;\n  font-size: 16px;\n  line-height: 28.8px;\n  line-height: 28.8px;\n  font-weight: 400;\n  display: inline-block;\n  margin-bottom: 24px;\n`;\n\nconst WorkBlockImagePC = styled(Img)`\n  @media (min-width: 1024px) {\n    width: 100%;\n    height: auto;\n    margin: 0 auto 20px;\n  }\n  @media (max-width: 1023px) {\n    display: none;\n  }\n  //TO DO:2021/03/30:公開後タブレット用画像用意する？\n`;\n\nconst WorkBlockImageSP = styled(Img)`\n  @media (min-width: 1024px) {\n    display: none;\n  }\n  @media (max-width: 1023px) {\n    width: 100%;\n    height: auto;\n    margin: 0 auto 20px;\n  }\n  //TO DO:2021/03/30:公開後タブレット用画像用意する？\n`;\n\nconst WorkProductDevelopment = () => {\n  return (\n    <PageRoot>\n      <SEOHeaderV2 pageTitle=\"実績紹介｜鋼板の生産ラインを自動化！熟練の匠にしかできない神技。自動制御システムで現場の負担を軽減\" />\n      <Root className=\"wrapper-v2\">\n        <BodyWrapper>\n          <CaptionRightAlign to={pagesV2.works.path}>\n            <TopAttention>実績紹介一覧</TopAttention>\n          </CaptionRightAlign>\n          <WorkContentWrapper>\n            <EyeCatchPic fluid={WorkFluidImages('workproductevelopment')} />\n            <WorkTitle>\n              鋼板の生産ラインを自動化！ 熟練の匠にしかできない神技。\n              自動制御システムで現場の負担を軽減\n            </WorkTitle>\n            <WorkTags>\n              <WorkTagsItem>#自動化</WorkTagsItem>\n              <WorkTagsItem>#機械学習</WorkTagsItem>\n            </WorkTags>\n            <WorkDescriptionWrapper>\n              <h2>プロジェクトの背景</h2>\n              <WorkParagraph>\n                &emsp;鉄鋼業向け機械工作機器メーカーとして歴史の長い、株式会社東研機械製作所は、基盤となる機器製造/販売とメンテナンス業に加えて、ソフトウェアを取り入れた新たな事業モデルを模索していました。\n              </WorkParagraph>\n              <WorkParagraph>\n                &emsp;鋼材製造現場においてベテラン技術者の高齢化及び慢性的な人手不足が深刻化していたことから、作業員の勘や経験に頼らないオペレーションを実現する製造ラインの自動化ソリューションを共同開発することになりました。\n                <br />\n                &emsp;鋼材製造ラインの自動化には機械、電気、ソフトウェア、ネットワーク等、幅広くかつ難度の高い技術の組み合わせが必要でしたが、機械と電気に強い同社と、ソフトウェアやシステム構築に強い弊社が組むことで実現したプロジェクトです。\n              </WorkParagraph>\n              <h2>取り組み内容</h2>\n              <WorkBlockImagePC\n                fluid={WorkDetailFluidImages(\n                  'workproductDevelopmentDescktop01',\n                )}\n              />\n              <WorkBlockImageSP\n                fluid={WorkDetailFluidImages('workproductDevelopmentMobile01')}\n              />\n              <WorkParagraph>\n                &emsp;鋼板製造ラインにおいて、熟練作業者が行うセンタリングという作業が自動化の対象となり、まずは現場作業の業務分析からスタートしました。\n                <br />\n                鋼板はコイル鋼材を巻き出し裁断して製造しますが、その巻き出しの過程で鋼板が右や左にずれていきます。\n                <br />\n                &emsp;熟練作業者はこのズレを目視で確認しながら、機器を操り適切なタイミングで鋼材の位置を右や左に補正します。\n                この目視で確認している部分を全てカメラで常時撮影し、ディープラーニング（CNN）を用いて画像からズレを定量化していきます。\n                <br />\n                さらに、熟練作業者の制御信号も同時に取得し、ズレの定量値と組み合わせてディープラーニング（RNN）で制御信号生成モデルを作成しました。\n                <br />\n                すなわち、熟練者の目と勘をハードウェアとディープラーニング技術によりモデル化し、鋼板製造ラインの自動化を目指したのです。\n              </WorkParagraph>\n              <WorkBlockImagePC\n                fluid={WorkDetailFluidImages(\n                  'workproductDevelopmentDescktop02',\n                )}\n              />\n              <WorkBlockImageSP\n                fluid={WorkDetailFluidImages('workproductDevelopmentMobile02')}\n              />\n\n              <WorkParagraph>\n                &emsp;現場では大電力系システムから来る電気ノイズや、鉄の粉塵、油等が舞う為、汎用的なハードウェアではすぐに壊れてしまう環境ですが、耐久性の高いエッジコンピューターシステムを構築し、安定的にカメラ映像や電気信号を取得できるようにしました。現在は、車の自動運転で言うところの「レベル3」の条件付き運転自動化を実現する為、日々、開発と実証実験を継続中です。\n              </WorkParagraph>\n            </WorkDescriptionWrapper>\n          </WorkContentWrapper>\n        </BodyWrapper>\n        <WorksOuter>\n          <Works />\n        </WorksOuter>\n      </Root>\n    </PageRoot>\n  );\n};\nexport default WorkProductDevelopment;\n"],"sourceRoot":""}