{"version":3,"file":"d7af1454-a66c3d9c4d282900346d.js","mappings":"8NAiBO,MAAMA,EAAyBC,IAM/B,IANgC,MACrCC,EAAK,KACLC,EAAO,KAAI,YACXC,EAAW,SACXC,EAAQ,SACRC,GACDL,EACC,MAAMM,EAASC,EAAaC,EAAAA,IAASP,IAC/B,EAAEQ,EAAC,KAAEC,IAASC,EAAAA,EAAAA,MAQpB,OANID,EAAKE,WAAaV,GACpBQ,EAAKG,eAAeX,GAAM,KACxBY,QAAQC,IAAI,sBAAsB,KAKpCC,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOY,OACfF,EAAAA,EAAAA,IAACG,EAAAA,EAAM,CAACjB,KAAMA,IACA,YAAbE,GACCY,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOc,iBAAkBf,IAEnCW,EAAAA,EAAAA,IAACK,EAAAA,SAAQ,MACPL,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOgB,YACbrB,GAASE,KACTa,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOiB,WACdtB,IAASe,EAAAA,EAAAA,IAAA,MAAIC,IAAKX,EAAOL,OAAQQ,EAAER,KACpCe,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOkB,SACdrB,IACCa,EAAAA,EAAAA,IAAA,MAAIC,IAAKX,EAAOH,aAAcA,OAMxCa,EAAAA,EAAAA,IAAA,OAAKC,IAAKX,EAAOmB,SAAUpB,KAG/BW,EAAAA,EAAAA,IAACU,EAAAA,EAAM,CAACxB,KAAMA,IACV,EAET,IAAAyB,EAAA,CAAAC,KAAA,SAAAtB,OAAA,uBAAAuB,EAAA,CAAAD,KAAA,SAAAtB,OAAA,kGAAAwB,EAAA,CAAAF,KAAA,UAAAtB,OAAA,6FAED,MAAMC,EAAeA,CAACC,EAAgBuB,KACpC,MAAMC,EAAkBD,EAAW,QAAU,QAC7C,MAAO,CACLb,KAAIY,EAMJR,WAAWL,EAAAA,EAAAA,IAAG,4BAEFe,EAAe,uBACHA,EAAe,kDAEjCxB,EAAMyB,OAAOC,YAAW,kBACxB1B,EAAMyB,OAAOE,QAAO,gHAM1Bf,iBAAiBH,EAAAA,EAAAA,IAAG,gCAEJT,EAAMyB,OAAOG,WAAWC,UAAS,cAEjDd,UAASM,EAOT5B,OAAOgB,EAAAA,EAAAA,IAAG,SACCT,EAAMyB,OAAOK,MAAK,iFAM7Bd,SAASP,EAAAA,EAAAA,IAAG,8EAMRT,EAAM+B,GAAGC,SAAQ,6BAIrBC,KAAId,EAGJxB,aAAac,EAAAA,EAAAA,IAAG,8BAELT,EAAMyB,OAAOK,MAAK,+DAK7Bb,SAASR,EAAAA,EAAAA,IAAG,kCAEIT,EAAMyB,OAAOG,WAAWC,UAAS,cAElD,C","sources":["webpack://aldagram-corporate/./src/ui/layouts/Layout.tsx"],"sourcesContent":["import { FC, Fragment } from 'react'\nimport { css } from '@emotion/react'\nimport Header from '@ui/molecules/Header'\nimport Footer from '@ui/molecules/Footer'\nimport { MyTheme, theme } from '@ui/styles/theme'\nimport 'modern-css-reset'\nimport { useTranslation } from 'react-i18next'\nimport { Languages } from '@/types/languages'\n\ntype LayoutType = {\n  title?: string\n  lang?: Languages\n  description?: string\n  pageType?: 'recruit' | 'other'\n  children?: React.ReactNode\n}\n\nexport const Layout: FC<LayoutType> = ({\n  title,\n  lang = 'ja',\n  description,\n  pageType,\n  children\n}) => {\n  const styles = createStyles(theme, !!title)\n  const { t, i18n } = useTranslation()\n\n  if (i18n.language !== lang) {\n    i18n.changeLanguage(lang, () => {\n      console.log('i18n.changeLanguage')\n    })\n  }\n\n  return (\n    <div css={styles.root}>\n      <Header lang={lang} />\n      {pageType === 'recruit' ? (\n        <div css={styles.layoutContainer}>{children}</div>\n      ) : (\n        <Fragment>\n          <div css={styles.container}>\n            {(title || description) && (\n              <div css={styles.titleArea}>\n                {title && <h1 css={styles.title}>{t(title)}</h1>}\n                <div css={styles.subArea}>\n                  {description && (\n                    <h2 css={styles.description}>{description}</h2>\n                  )}\n                </div>\n              </div>\n            )}\n          </div>\n          <div css={styles.content}>{children}</div>\n        </Fragment>\n      )}\n      <Footer lang={lang} />\n    </div>\n  )\n}\n\nconst createStyles = (theme: MyTheme, hasTitle: boolean) => {\n  const containerHeight = hasTitle ? '330px' : '250px'\n  return {\n    root: css`\n      display: grid;\n      grid-template-rows: auto 1fr auto;\n      grid-template-columns: 100%;\n      min-height: 100vh;\n    `,\n    container: css`\n      position: relative;\n      height: ${containerHeight};\n      margin-bottom: calc(${containerHeight} * -0.36);\n      background: linear-gradient(\n        ${theme.colors.primaryDark} 15%,\n        ${theme.colors.primary}\n      );\n      clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 64%);\n      transition: all 0.4s ease;\n      z-index: 99;\n    `,\n    layoutContainer: css`\n      position: relative;\n      background: ${theme.colors.background.innermost};\n    `,\n    titleArea: css`\n      max-width: 1212px;\n      margin: 0 auto;\n      padding: 120px 32px 70px;\n      box-sizing: border-box;\n      position: relative;\n    `,\n    title: css`\n      color: ${theme.colors.white};\n      font-size: 24px;\n      font-weight: bold;\n      line-height: 36px;\n      position: absolute;\n    `,\n    subArea: css`\n      position: absolute;\n      right: 0;\n      padding-right: 32px;\n      text-align: right;\n      display: none;\n      ${theme.mq.isTablet} {\n        display: block;\n      }\n    `,\n    logo: css`\n      padding-bottom: 20px;\n    `,\n    description: css`\n      white-space: pre-wrap;\n      color: ${theme.colors.white};\n      font-size: 14px;\n      font-weight: bold;\n      line-height: 28px;\n    `,\n    content: css`\n      padding-bottom: 48px;\n      background: ${theme.colors.background.innermost};\n    `\n  }\n}\n"],"names":["Layout","_ref4","title","lang","description","pageType","children","styles","createStyles","theme","t","i18n","useTranslation","language","changeLanguage","console","log","___EmotionJSX","css","root","Header","layoutContainer","Fragment","container","titleArea","subArea","content","Footer","_ref","name","_ref2","_ref3","hasTitle","containerHeight","colors","primaryDark","primary","background","innermost","white","mq","isTablet","logo"],"sourceRoot":""}