{"version":3,"file":"fe51ed9460c402c2ab2453dce0ee57f3d40ab7ac-1ffcb529d7b7956058a4.js","mappings":"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","sources":["webpack://beaver-help/./src/components/atoms/adsenseSide300x250.tsx","webpack://beaver-help/./src/components/atoms/columnH1.tsx","webpack://beaver-help/./src/components/atoms/columnOfficialBnr.tsx","webpack://beaver-help/./src/components/atoms/scrollTop.tsx","webpack://beaver-help/./src/components/atoms/columnSideLink.tsx","webpack://beaver-help/./src/components/molecules/columnSideNewList.tsx","webpack://beaver-help/./src/components/molecules/downloadBtnArea.tsx","webpack://beaver-help/./src/components/atoms/columnPath.tsx","webpack://beaver-help/./src/components/organisms/ColumnFooter.tsx","webpack://beaver-help/./src/components/organisms/columnHeader.tsx","webpack://beaver-help/./src/components/organisms/columnHeadNav.tsx","webpack://beaver-help/./src/components/organisms/columnLayout.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\nimport styled from '@emotion/styled'\nimport { useLocation } from '@reach/router'\n\nconst Wrapper = styled.div`\n  margin-bottom: 10px;\n\n  ins {\n    width: 300px;\n    height: 250px;\n  }\n`\n\n/**\n * キンクラ_ディスプレイ_固定_サイドメニュー用_300x250\n * @constructor\n */\nconst AdsenseSide300x250 = (): JSX.Element => {\n    const location = useLocation()\n\n    // useEffect(() => {\n    //   ;(window.adsbygoogle = window.adsbygoogle || []).push({})\n    // }, [location.pathname])\n    \n    useEffect(() => {\n        if (window) {\n            window.adsbygoogle = window.adsbygoogle || []\n            window.adsbygoogle.push({})\n        }\n    }, [location.pathname])\n\n    return (\n        <Wrapper>\n            <ins\n                className=\"adsbygoogle\"\n                style={{display: 'block', width: '300px', height: '250px'}}\n                data-ad-client=\"ca-pub-2094251769663608\"\n                data-ad-slot=\"9819821797\"\n                data-ad-format=\"auto\"\n                data-full-width-responsive=\"false\"\n            />\n        </Wrapper>\n    )\n}\n\nexport default AdsenseSide300x250\n","import styled from '@emotion/styled'\nimport React from 'react'\n\nconst H1 = styled.h1`\n  color: #414141;\n  font-size: 22px;\n  margin: 0 0 15px;\n  border: none;\n  display: block;\n  p {\n    width: 100%;\n    margin: 0 0 3px;\n    padding: 0 0 15px;\n    display: inline-block;\n    position: relative;\n    border-bottom: solid 3px #e5e5e5;\n    span {\n      line-height: 1.6em;\n      /* display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden; */\n    }\n    &:before {\n      position: absolute;\n      bottom: -3px;\n      left: 0;\n      width: 20%;\n      height: 3px;\n      content: '';\n      background: #77d7c9;\n    }\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n  /** タイトル */\n  label: string\n}\n\n/**\n * コラム用共通H1コンポーネント\n * @param props\n * @constructor\n */\nconst ColumnH1 = (props: Props): JSX.Element => {\n  const { className = '' } = props\n\n  return (\n    <H1 className={className}>\n      <p>\n        <span>{props.label}</span>\n      </p>\n    </H1>\n  )\n}\n\nexport default ColumnH1\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\n\nconst StyledLink = styled(Link)`\n  display: block;\n  margin-bottom: 30px;\n  img {\n    width: 300px;\n    height: 132px;\n  }\n  p {\n    text-align: center;\n  }\n  ${BreakPoints.large} {\n    display: inline-block;\n    margin: 0 10px 20px;\n  }\n  ${BreakPoints.medium} {\n    display: block;\n    text-align: center;\n    margin: 0 auto 20px;\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n  /** リンク先 */\n  href: string\n  /** 画像 */\n  imgId: string\n  /** タイトル */\n  label: string\n  target: string\n}\n\n/**\n * コラムサイドバー用バナーコンポーネント（製品サイト誘導）\n * @param props\n * @constructors\n */\nconst ColumOfficialBnr = (props: Props): JSX.Element => {\n  const { className = '' } = props\n\n  return (\n    <StyledLink className={className} to={props.href} target={props.target}>\n      <img\n        src={`/images/column/common/${props.imgId}`}\n        alt=\"キンクラのご紹介\"\n      />\n      <p>{props.label}</p>\n    </StyledLink>\n  )\n}\n\nexport default ColumOfficialBnr\n","import styled from '@emotion/styled'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\n\nconst Wrapper = styled.div`\n  .page-top {\n    position: fixed;\n    right: 30px;\n    bottom: 70px;\n    z-index: 100;\n    width: 50px;\n    height: 50px;\n    border-radius: 50%;\n    background-color: #3ec7b3;\n    border: solid 4px #9aece0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.3s ease;\n    color: transparent;\n    &:before {\n      content: '';\n      width: 12px;\n      height: 12px;\n      margin-bottom: -6px;\n      border-top: solid 3px #fff;\n      border-right: solid 3px #fff;\n      transform: rotate(-45deg);\n      position: absolute;\n    }\n    &:hover {\n      transform: scale(1.1);\n    }\n  }\n  ${BreakPoints.medium} {\n  }\n`\n\n/**\n * ページ上部スクロール\n * @constructor\n */\nconst ScrollTop = () => (\n  <Wrapper>\n    <a className=\"page-top\" href=\"#pageTop\">\n      TOP\n    </a>\n  </Wrapper>\n)\n\nexport default ScrollTop\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\n\nconst StyledLink = styled(Link)`\n  margin-bottom: 10px;\n  position: relative;\n  left: 14px;\n  display: block;\n  width: calc(100% - 14px);\n  &:before {\n    display: block;\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    top: 7px;\n    left: -14px;\n    border-left: 8px solid #3ec7b3;\n    border-top: 4px solid transparent;\n    border-bottom: 4px solid transparent;\n  }\n  h2 {\n    font-size: 16px;\n    font-weight: 400;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    color: #505050;\n    transition: 0.3s all;\n  }\n  span {\n    color: #ababab;\n  }\n  &:hover {\n    text-decoration: underline solid rgba(255, 255, 255, 0);\n    h2 {\n      text-decoration: underline solid #3abd9e;\n      color: #00b5a6;\n    }\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n  /** リンク先 */\n  href: string\n  /** タイトル */\n  label: string\n  /** 日付 */\n  date: string\n}\n\n/**\n * コラムサイドバー用リストリンクコンポーネント\n * @param props\n * @constructor\n */\nconst ColumnSideLink = (props: Props): JSX.Element => {\n  const { className = '' } = props\n\n  return (\n    <StyledLink className={className} to={props.href}>\n      {/** TODO 記事のタイトルがここに表示されます */}\n      <h2>{props.label}</h2>\n      {/** TODO 川上申し送り事項：▼記事の投稿日がここに表示されます */}\n      <span>{props.date}</span>\n    </StyledLink>\n  )\n}\n\nexport default ColumnSideLink\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport useRouteParam from '../../hooks/useRouteParam'\nimport ColumnH1 from '../atoms/columnH1'\nimport ColumnSideLink from '../atoms/columnSideLink'\n\nconst Wrapper = styled.div`\n  position: relative;\n  border-bottom: solid 2px #e5e5e5;\n  margin-bottom: 30px;\n\n  .aside-h1 {\n    p {\n      border-bottom-width: 2px;\n      padding: 0 0 5px;\n\n      &:before {\n        display: none;\n      }\n    }\n  }\n\n  .p-list-link {\n    position: absolute;\n    top: 9px;\n    right: 2px;\n\n    &:before {\n      display: block;\n      content: '';\n      position: absolute;\n      width: 0;\n      height: 0;\n      top: 7px;\n      left: -14px;\n      border-left: 8px solid #3ec7b3;\n      border-top: 4px solid transparent;\n      border-bottom: 4px solid transparent;\n    }\n  }\n`\n\n/**\n * コラムサイドバー用リスト型ボタンリンクコンポーネント：新着コラム\n * @constructor\n */\nconst ColumnSideNewList = (): JSX.Element => {\n  const routeParam = useRouteParam('/column/details/C0079/')\n  const routeParam2 = useRouteParam('/column/details/C0078/')\n  const routeParam3 = useRouteParam('/column/details/C0077/')\n  return (\n    <Wrapper>\n      <ColumnH1 className=\"aside-h1\" label=\"新着コラム\" />\n      <Link className=\"p-list-link\" to={useRouteParam('/column/list/')}>\n        コラム一覧を表示\n      </Link>\n      <ColumnSideLink\n        href={routeParam}\n        label=\"勤怠の締め日にはどんな作業をする？締め作業を軽減する方法とは？\"\n        date=\"2025.02.28\"\n      />\n      <ColumnSideLink\n        href={routeParam2}\n        label=\"遅刻早退時の賃金控除について、適用する際の注意事項などを解説！\"\n        date=\"2025.01.23\"\n      />\n      <ColumnSideLink\n        href={routeParam3}\n        label=\"36協定に違反しないためには？協定違反となる事例集、違反しないための注意点などを解説！\"\n        date=\"2024.12.17\"\n      />\n    </Wrapper>\n  )\n}\n\nexport default ColumnSideNewList\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\n\nconst Wrapper = styled.div`\n  width: 100%;\n  text-align: center;\n  margin: 0 auto 50px;\n  a {\n    img {\n      width: 220px;\n      height: auto;\n    }\n  }\n  img {\n    width: 220px;\n    height: auto;\n  }\n  p {\n    font-size: 0.875em;\n    color: #78828d;\n    max-width: 540px;\n    padding: 0 20px;\n    margin: 0 auto;\n  }\n`\n/**\n * アプリダウンロードボタンエリア\n * @constructor\n */\nconst DownloadBtnArea = () => (\n  <Wrapper>\n    <Link\n      to=\"https://itunes.apple.com/jp/app/id1590320141?mt=8\"\n      target=\"_blank\"\n      rel=\"noreferrer\"\n    >\n      <img\n        src=\"/images/official/common/bnrApp01.png\"\n        alt=\"iOSアプリダウンロードはこちら\"\n      />\n    </Link>\n    <Link\n      to=\"http://play.google.com/store/apps/details?id=jp.clinks.kintaicloud\"\n      target=\"_blank\"\n      rel=\"noreferrer\"\n    >\n      <img\n        src=\"/images/official/common/bnrGoogle01.png\"\n        alt=\"Androidアプリダウンロードはこちら\"\n      />\n    </Link>\n\n    {/* <img\n      src=\"/images/official/common/bnrApp00.png\"\n      alt=\"iOSアプリダウンロードはこちら\"\n    />\n    <img\n      src=\"/images/official/common/bnrGoogle00.png\"\n      alt=\"Androidアプリダウンロードはこちら\"\n    /> */}\n    <p>\n      ※AppleとAppleのロゴは、米国およびその他の国で登録されたApple\n      Inc.の商標です。\n    </p>\n    <p>※Google Play および Google Play ロゴは、Google LLC の商標です。</p>\n  </Wrapper>\n)\nexport default DownloadBtnArea\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React, { ReactNode } from 'react'\nimport BreakPoints from '../../styles/breakPoints'\n\nconst Wrapper = styled.div`\n  width: 45%;\n  display: flex;\n  p {\n    max-width: 390px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    display: inline-block;\n    line-height: 1em;\n    &:first-child {\n      width: 149px;\n      min-width: 149px;\n    }\n    &:nth-child(2) {\n      width: 124px;\n      min-width: 124px;\n    }\n    .arrow {\n      padding: 0 5px;\n    }\n    a {\n      color: #00b5a6;\n    }\n  }\n  ${BreakPoints.xxLarge} {\n    width: 100vw;\n    padding: 2px 10px 0;\n    height: 40px;\n    align-items: center;\n    border-top: solid 1px #e5e5e5;\n    p {\n      max-width: calc(100vw - 174px);\n    }\n  }\n`\n\nexport type IColumnPath = {\n  /** タイトル */\n  title: string\n  /** リンク */\n  link?: string\n}\ntype IProps = {\n  paths: IColumnPath[]\n}\n\n/**\n * コラム用パンくずコンポーネント\n * @constructor\n */\nconst ColumnPath = ({ paths }: IProps) => (\n  <Wrapper>\n    {paths.map(({ title, link }, index) => {\n      let node: ReactNode\n      if (link) node = <Link to={link}>{title}</Link>\n      else node = <span>{title}</span>\n      return (\n        <p key={`topic-path-${index}`}>\n          {node}\n          {index < paths.length - 1 && <span className=\"arrow\">&gt;</span>}\n        </p>\n      )\n    })}\n  </Wrapper>\n)\n\nexport default ColumnPath\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport LogoSvg from '../atoms/logoSvg'\nimport DownloadBtnArea from '../molecules/downloadBtnArea'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.footer`\n  width: 100%;\n  background: #1e3041;\n  text-align: center;\n  position: relative;\n\n  .p-foot-inner {\n    max-width: 1366px;\n    margin: 0 auto;\n    padding: 40px 10px 20px;\n    display: flex;\n    justify-content: center;\n    flex-wrap: wrap;\n\n    .p-nav-area {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      width: 100%;\n      margin-bottom: 50px;\n\n      a {\n        color: #ffffff;\n        display: block;\n        font-weight: 600;\n        margin: 0 60px 0 0;\n        text-decoration: none;\n        position: relative;\n\n        &:hover {\n          text-decoration: none;\n        }\n\n        &:last-child {\n          margin-right: 0;\n        }\n      }\n\n      &.sub {\n        a {\n          font-size: 0.875em;\n          color: #78828d;\n          font-weight: 400;\n          margin: 0 40px 0 0;\n        }\n      }\n    }\n\n    .p-logo-copy {\n      width: 100%;\n      margin: 0 0 -5px;\n      color: #ffffff;\n      font-size: 0.875em;\n      text-align: center;\n    }\n\n    .p-logo-link {\n      height: 64px;\n      width: 200px;\n      display: flex;\n      align-items: center;\n      margin: 0 auto 20px;\n\n      .logo {\n        margin: 0 5px 0 0;\n        padding: 0;\n        width: 200px;\n\n        svg {\n          .logo-txt {\n            fill: #ffffff;\n          }\n        }\n      }\n    }\n\n    .p-copyright {\n      width: 100%;\n      font-size: 0.875em;\n      color: #78828d;\n    }\n  }\n\n  ${BreakPoints.xLarge} {\n    .p-foot-inner {\n      .p-nav-area {\n        display: block;\n        text-align: center;\n\n        a {\n          display: inline-block;\n          margin: 0;\n          padding: 0 15px 10px;\n        }\n\n        &.sub {\n          a {\n            margin: 0;\n          }\n        }\n      }\n    }\n  }\n\n  ${BreakPoints.medium} {\n  }\n`\n\n/**\n * コラムサイトフッター\n * @constructor\n */\nconst Columnfooter = () => {\n  const routeParam1 = useRouteParam('https://www.kintaicloud.jp/feature/')\n  const routeParam2 = useRouteParam('https://www.kintaicloud.jp/benefit/')\n  const routeParam3 = useRouteParam('https://www.kintaicloud.jp/function/')\n  const routeParam4 = useRouteParam('https://www.kintaicloud.jp/plan-list/')\n  const routeParam5 = useRouteParam('https://www.kintaicloud.jp/service-faq/')\n  const routeParam6 = useRouteParam('https://www.kintaicloud.jp/gallery/')\n  const routeParam7 = useRouteParam('https://www.kintaicloud.jp/download/')\n  const routeParam8 = useRouteParam('https://www.kintaicloud.jp/help/')\n  const routeParam9 = useRouteParam('https://sign-up.kintaicloud.jp/sign-up')\n  const routeParam10 = useRouteParam('https://app.kintaicloud.jp')\n  const routeParam11 = useRouteParam('https://www.kintaicloud.jp/terms/')\n  const routeParam12 = useRouteParam('https://www.kintaicloud.jp/policy/')\n  const routeParam13 = useRouteParam(\n    'https://www.kintaicloud.jp/externaltools/'\n  )\n  const routeParam14 = useRouteParam('https://www.kintaicloud.jp/law/')\n  const routeParam15 = useRouteParam('https://www.kintaicloud.jp/contact/')\n\n  return (\n    <Wrapper>\n      <div className=\"p-foot-inner\">\n        <div className=\"p-nav-area mb-040\">\n          <a href={routeParam1} target=\"_blank\" rel=\"noreferrer\">\n            特徴\n          </a>\n          <a href={routeParam2} target=\"_blank\" rel=\"noreferrer\">\n            導入効果\n          </a>\n          <a href={routeParam3} target=\"_blank\" rel=\"noreferrer\">\n            機能\n          </a>\n          <a href={routeParam4} target=\"_blank\" rel=\"noreferrer\">\n            料金\n          </a>\n          <a href={routeParam5} target=\"_blank\" rel=\"noreferrer\">\n            よくあるご質問\n          </a>\n          <a href={routeParam6} target=\"_blank\" rel=\"noreferrer\">\n            ギャラリー\n          </a>\n          <a href={routeParam7} target=\"_blank\" rel=\"noreferrer\">\n            資料ダウンロード\n          </a>\n          <a href={routeParam8} target=\"_blank\" rel=\"noreferrer\">\n            ヘルプ\n          </a>\n        </div>\n        <div className=\"p-nav-area\">\n          <a href={routeParam9} target=\"_blank\" rel=\"noreferrer\">\n            アカウント作成\n          </a>\n          <a href={routeParam10} target=\"_blank\" rel=\"noreferrer\">\n            ログイン\n          </a>\n        </div>\n        <p className=\"p-logo-copy anim-fade-up delay-2\">\n          ＼ すべての企業に、勤怠クラウドを ／\n        </p>\n        <Link to={useRouteParam('/')} className=\"p-logo-link anim-fade-up\">\n          <LogoSvg />\n        </Link>\n        <DownloadBtnArea />\n        <div className=\"p-nav-area sub\">\n          <a href={routeParam11} target=\"_blank\" rel=\"noreferrer\">\n            利用規約\n          </a>\n          <a href={routeParam12} target=\"_blank\" rel=\"noreferrer\">\n            プライバシーポリシー\n          </a>\n          <a href={routeParam13} target=\"_blank\" rel=\"noreferrer\">\n            外部送信規律に関する公表事項\n          </a>\n          <a href={routeParam14} target=\"_blank\" rel=\"noreferrer\">\n            特定商取引法に基づく表記\n          </a>\n          <a href={routeParam15} target=\"_blank\" rel=\"noreferrer\">\n            お問い合わせ\n          </a>\n          <a href=\"https://clinks.jp/\" target=\"_blank\" rel=\"noreferrer\">\n            運営会社\n          </a>\n        </div>\n        <p className=\"p-copyright\">\n          &copy;2021 CLINKS Co., Ltd. All Rights Reserved.\n        </p>\n      </div>\n    </Wrapper>\n  )\n}\n\nexport default Columnfooter\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\nimport BreakPoints from '../../styles/breakPoints'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.header`\n  display: flex;\n  align-items: center;\n  padding: 0 10px;\n  height: 80px;\n  width: 100vw;\n  justify-content: space-between;\n  position: fixed;\n  background: #ffffff;\n  z-index: 2;\n\n  .logo-wrap {\n    margin: 0 auto 0 0;\n\n    .p-header-logo {\n      width: 250px;\n      height: auto;\n      display: flex;\n      align-items: center;\n\n      img {\n        width: 100%;\n      }\n    }\n\n    h1 {\n      font-weight: 400;\n      font-size: 11.5px;\n      margin: 6px 0 0 6px;\n      color: #153758;\n    }\n  }\n\n  .right-area {\n    padding: 0 20px 0 0;\n    display: flex;\n    align-items: center;\n\n    .search-input-wrap {\n      margin-right: 20px;\n    }\n\n    .download-link {\n      margin-left: 20px;\n    }\n\n    .product-link {\n      display: none;\n    }\n  }\n\n  ${BreakPoints.large} {\n    .right-area {\n      .product-link {\n        display: block;\n        margin-left: 20px;\n      }\n    }\n  }\n\n  ${BreakPoints.medium} {\n    .logo-wrap {\n      margin: 0 auto 0 0;\n\n      .p-header-logo {\n        width: 160px;\n      }\n\n      h1 {\n        display: none;\n      }\n    }\n\n    .right-area {\n      padding: 0;\n\n      .support-link,\n      .product-link {\n        display: none;\n      }\n    }\n  }\n\n  ${BreakPoints.small} {\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n}\n\n/**\n * コラムヘッダーコンポーネント\n * @constructor\n */\nconst ColumnHeader = (props: Props): JSX.Element => {\n  const { className = '' } = props\n  const routeParam = useRouteParam('/contact/')\n  const routeParam2 = useRouteParam('/download/')\n  const routeParam3 = useRouteParam('/support/')\n\n  return (\n    <>\n      <Helmet>\n        <script\n          async\n          src=\"https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-2094251769663608\"\n          crossOrigin=\"anonymous\"\n        />\n      </Helmet>\n      <Wrapper className={className}>\n        <div className=\"logo-wrap\">\n          <Link to={useRouteParam('/column/')} className=\"p-header-logo\">\n            <img src=\"/images/column/top/logo.png\" alt=\"キンクラコラム\" />\n          </Link>\n          <h1>\n            勤怠管理、労働基準法に関する知識や役に立つ情報をお届けするキンクラコラム\n          </h1>\n        </div>\n        <div className=\"right-area\">\n          <a\n            className=\"support-link\"\n            href={routeParam}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            お問い合わせ\n          </a>\n          <a\n            className=\"download-link\"\n            href={routeParam2}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            資料ダウンロード\n          </a>\n          <a\n            className=\"product-link\"\n            href={routeParam3}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            製品情報\n          </a>\n        </div>\n      </Wrapper>\n    </>\n  )\n}\n\nexport default ColumnHeader\n","import styled from '@emotion/styled'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.section`\n  width: 60%;\n  min-width: 690px;\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  margin: 0 0 0 auto;\n\n  p {\n    width: 90px;\n    height: 28px;\n    position: relative;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    color: #00b5a6;\n    border: solid 1px #9ae1d7;\n    border-radius: 3px;\n    box-sizing: border-box;\n    margin: 0 10px 0 0;\n\n    &:before {\n      content: '';\n      position: absolute;\n      right: -14px;\n      border: 6px solid transparent;\n      border-left: 10px solid #fff;\n      z-index: 2;\n    }\n\n    &:after {\n      content: '';\n      position: absolute;\n      right: -15px;\n      border: 5px solid transparent;\n      border-left: 9px solid #9ae1d7;\n      z-index: 1;\n    }\n\n    span {\n      display: block;\n      margin: 0;\n      padding: 0;\n    }\n  }\n\n  a {\n    display: block;\n    margin: 0 10px 0 20px;\n  }\n\n  ${BreakPoints.xxLarge} {\n    width: 100vw;\n    min-width: unset;\n    margin: 0;\n    padding: 2px 10px 0;\n    justify-content: flex-start;\n  }\n`\n\n/**\n * コラムサイトヘッダー製品情報コンポーネント\n * @constructor\n */\nconst ColumnHeadNav = () => {\n  const routePram = useRouteParam('/feature/')\n  const routePram2 = useRouteParam('/benefit/')\n  const routePram3 = useRouteParam('/function/')\n  const routePram4 = useRouteParam('/plan-list/')\n\n  return (\n    <Wrapper>\n      <p>製品情報</p>\n      <a href={routePram} target=\"_blank\" rel=\"noreferrer\">\n        特徴\n      </a>\n      <a href={routePram2} target=\"_blank\" rel=\"noreferrer\">\n        導入メリット\n      </a>\n      <a href={routePram3} target=\"_blank\" rel=\"noreferrer\">\n        機能一覧\n      </a>\n      <a href={routePram4} target=\"_blank\" rel=\"noreferrer\">\n        料金プラン\n      </a>\n    </Wrapper>\n  )\n}\n\nexport default ColumnHeadNav\n","import styled from '@emotion/styled'\nimport React, { ReactNode } from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport ColumnPath, { IColumnPath } from '../atoms/columnPath'\nimport ColumnFooter from './ColumnFooter'\nimport ColumnHeader from './columnHeader'\nimport ColumnHeadNav from './columnHeadNav'\nimport ScrollTop from '../atoms/scrollTop'\n\nconst Wrapper = styled.div`\n  background: #ffffff;\n  margin: 0 auto;\n  padding: 120px 0 0;\n  line-height: 1.6em;\n\n  &#pageTop {\n    padding-top: 120px !important;\n  }\n\n  .relation-link {\n    a {\n      color: #0075ff;\n\n      &:hover {\n        text-decoration: underline solid #0075ff;\n      }\n    }\n\n    + .relation-link {\n      margin-top: -20px;\n    }\n  }\n\n  a {\n    color: #243650;\n\n    &:hover {\n      color: #00b5a6;\n    }\n\n    &.column-detail-link {\n      position: relative;\n      z-index: 1;\n      color: #0075ff;\n      margin-bottom: 20px;\n\n      &:hover {\n        text-decoration: underline solid #0075ff;\n      }\n    }\n  }\n\n  .p-foot-inner {\n    .anim-fade-up {\n      opacity: 1;\n      visibility: visible;\n      transform: translateY(0px);\n    }\n  }\n\n  ${BreakPoints.large} {\n    padding: 30px 0 0;\n  }\n`\nconst Nav = styled.nav`\n  background: #ffffff;\n  display: flex;\n  align-items: center;\n  padding: 1px 30px 0 10px;\n  height: 40px;\n  top: 80px;\n  width: 100vw;\n  justify-content: space-between;\n  position: fixed;\n  z-index: 2;\n  border-top: solid 1px #e5e5e5;\n  border-bottom: solid 1px #e5e5e5;\n\n  a {\n    color: #505050;\n\n    &:hover {\n      color: #00b5a6;\n    }\n  }\n\n  ${BreakPoints.xxLarge} {\n    padding: 0;\n    height: 80px;\n    flex-wrap: wrap-reverse;\n    justify-content: space-around;\n  }\n\n  ${BreakPoints.large} {\n    display: none;\n  }\n`\n\nexport type PageType = 'index' | 'list' | 'detail'\n\ntype Props = {\n  /** パンくずパス */\n  paths?: IColumnPath[]\n  /** 子要素 */\n  children: ReactNode\n}\n\n/**\n * コラム用レイアウト\n * @constructor\n */\nconst ColumnLayout = ({ paths, children }: Props) => (\n  <>\n    <ColumnHeader />\n    <noscript>Javascriptが無効なため有効にしてください</noscript>\n    <Nav>\n      {paths && <ColumnPath paths={paths} />}\n      <ColumnHeadNav />\n    </Nav>\n    <Wrapper id=\"pageTop\">\n      {children}\n      <ColumnFooter />\n      <ScrollTop />\n    </Wrapper>\n  </>\n)\n\nexport default ColumnLayout\n"],"names":["Wrapper","location","useLocation","useEffect","window","adsbygoogle","push","pathname","className","style","display","width","height","H1","props","label","StyledLink","Link","BreakPoints","to","href","target","src","imgId","alt","date","routeParam","useRouteParam","routeParam2","routeParam3","rel","paths","map","index","node","title","link","key","length","routeParam1","routeParam4","routeParam5","routeParam6","routeParam7","routeParam8","routeParam9","routeParam10","routeParam11","routeParam12","routeParam13","routeParam14","routeParam15","Helmet","async","crossOrigin","routePram","routePram2","routePram3","routePram4","Nav","children","id","ColumnFooter"],"sourceRoot":""}