{"version":3,"file":"component---src-pages-column-details-c-0009-tsx-f77313caa426361042e7.js","mappings":"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","sources":["webpack://beaver-help/./src/components/atoms/columnBtnCard.tsx","webpack://beaver-help/./src/components/molecules/Introduction003.tsx","webpack://beaver-help/./src/components/molecules/columnAuthor001.tsx","webpack://beaver-help/./src/components/molecules/columnRelationCards0002.tsx","webpack://beaver-help/./src/components/molecules/usefulFunctionLayout005.tsx","webpack://beaver-help/./src/components/molecules/columnDetailInner0009.tsx","webpack://beaver-help/./src/pages/column/details/C0009.tsx"],"sourcesContent":["import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\n\nconst StyledLink = styled(Link)`\n  padding: 7px;\n  width: 220px;\n  border-radius: 5px;\n  border: solid 3px transparent;\n  margin-bottom: 15px;\n  &:hover {\n    border-color: #77d7c9;\n    text-decoration: underline solid rgba(255, 255, 255, 0);\n  }\n  .img-wrap {\n    width: 200px;\n    height: 100px;\n    overflow: hidden;\n    margin-bottom: 12px;\n    img {\n      width: 110%;\n      height: auto;\n    }\n  }\n  h2 {\n    font-size: 18px;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    margin-bottom: 8px;\n  }\n  span {\n    color: #ababab;\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n  /** リンク先 */\n  href: string\n  /** 画像 */\n  imgId: string\n  /** タイトル */\n  label: string\n  /** タイトル */\n  date: string\n}\n\n/**\n * コラム用カード型ボタンリンクコンポーネント\n * @param props\n * @constructor\n */\nconst ColumnBtnCard = (props: Props): JSX.Element => {\n  const { className = '' } = props\n\n  return (\n    <StyledLink className={className} to={props.href}>\n      <div className=\"img-wrap\">\n        {/** TODO 川上申し送り事項：▼記事ごとに指定されて画像がここに表示されます */}\n        <img\n          src={`/images/column/details/${props.imgId}`}\n          alt=\"キンクラコラム\"\n        />\n      </div>\n      {/** TODO 川上申し送り事項：▼記事のタイトルがここに表示されます */}\n      <h2>{props.label}</h2>\n      {/** TODO 川上申し送り事項：▼記事の投稿日がここに表示されます */}\n      <span>{props.date}</span>\n    </StyledLink>\n  )\n}\n\nexport default ColumnBtnCard\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.article`\n  display: flex;\n  justify-content: center;\n  flex-wrap: wrap;\n  text-align: center;\n  margin-bottom: 60px;\n  border: solid 2px #bef1e5;\n  border-radius: 5px;\n  padding: 45px;\n\n  .intro-txt {\n    font-size: 30px;\n    line-height: 1;\n    color: #ff9600;\n    font-weight: 600;\n  }\n\n  .detail-txt {\n    line-height: 1.8;\n  }\n\n  .btn-wrap {\n    display: flex;\n    width: 100%;\n    justify-content: center;\n\n    a {\n      border-radius: 25vh;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      font-size: 16px;\n      font-weight: 600;\n      color: #ffffff;\n      background: #19ba9b;\n      border: solid 2px #19ba9b;\n      width: 200px;\n      height: 50px;\n\n      &:hover {\n        opacity: 1;\n        background: #ffffff;\n        color: #3ec7b3;\n        text-decoration: underline solid rgba(255, 255, 255, 0);\n      }\n    }\n  }\n\n  ${BreakPoints.large} {\n  }\n`\n\n/**\n * コラム記事詳細：製品誘導案_クラウド型の勤怠システムだからこそおすすめできます！\n * @constructor\n */\nconst Introduction002 = () => (\n  <Wrapper>\n    <p className=\"intro-txt\">\n      クラウド型の勤怠システムだからこそおすすめできます！\n    </p>\n    <p className=\"detail-txt\">\n      「キンクラ」は、初期費用ゼロ、専用機器ゼロ、セキュリティ対策も万全。\n      <br />\n      リアルタイムに情報を把握できるので、管理者の負担も軽減されます。\n    </p>\n    <div className=\"btn-wrap\">\n      <Link to={useRouteParam('/feature/')} target=\"_blank\">\n        キンクラの特徴\n      </Link>\n    </div>\n  </Wrapper>\n)\n\nexport default Introduction002\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\n\nconst Wrapper = styled.article`\n  position: relative;\n  margin-bottom: 60px;\n  border: solid 2px #e5e5e5;\n  border-radius: 5px;\n  padding: 20px;\n\n  section {\n    display: flex;\n    justify-content: left;\n    align-items: center;\n\n    img {\n      width: 110px;\n      height: 110px;\n      margin: 0 20px 0 0;\n    }\n\n    .author-wrap {\n      position: relative;\n      width: 100%;\n\n      p {\n        line-height: 2;\n\n        &.author-name {\n          font-size: 18px;\n          font-weight: 600;\n\n          span {\n            font-weight: 400;\n            font-size: 14px;\n          }\n        }\n\n        &.author-job {\n          position: relative;\n          width: 100%;\n          margin-left: 14px;\n\n          &:before {\n            display: block;\n            content: '';\n            position: absolute;\n            width: 0;\n            height: 0;\n            top: 10px;\n            left: -14px;\n            border-left: 8px solid #3ec7b3;\n            border-top: 4px solid transparent;\n            border-bottom: 4px solid transparent;\n          }\n\n          a {\n            margin-right: 15px;\n          }\n        }\n      }\n    }\n  }\n\n  .detail-txt {\n    border-top: solid 1px #dcdee1;\n    margin-top: 20px;\n    padding-top: 15px;\n    line-height: 1.8;\n  }\n\n  ${BreakPoints.large} {\n  }\n`\n\n/**\n * コラム記事詳細：オーサ情報 蓑田 真吾（ミノダ シンゴ）\n * @constructor\n */\nconst columnAuthor001 = () => (\n  <Wrapper>\n    {/** TODO 川上申し送り事項：▼記事投稿（？）で作成された内容がここに入る予定 */}\n    <section>\n      <img src=\"/images/column/authors/a001.png\" alt=\"蓑田 真吾\" />\n      <div className=\"author-wrap\">\n        <p className=\"author-name\">\n          蓑田 真吾<span>（ミノダ シンゴ）</span>\n        </p>\n        <p className=\"author-job\">\n          <Link\n            to=\"https://www.minodashahorou.com/\"\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            みのだ社会保険労務士事務所\n          </Link>\n          代表 社会保険労務士\n        </p>\n      </div>\n    </section>\n    <div className=\"detail-txt\">\n      社会保険労務士(社労士)独立後は労務トラブルが起こる前の事前予防対策に特化。現在は様々な労務管理手法を積極的に取り入れ企業の人事労務業務をサポートしている。また、年金・医療保険に関する問題や労働法・働き方改革関する専門家として、実務相談を多く取り扱い、大手出版社からも書籍出版するなど、多方面で執筆活動を行う。\n    </div>\n  </Wrapper>\n)\n\nexport default columnAuthor001\n","import styled from '@emotion/styled'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport ColumnBtnCard from '../atoms/columnBtnCard'\nimport ColumnH1 from '../atoms/columnH1'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.article`\n  section {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n\n    span {\n      display: none;\n    }\n  }\n\n  ${BreakPoints.large} {\n    margin-bottom: 10px;\n  }\n`\n\n/**\n * 関連記事カードセット\n * TODO 川上申し送り事項：記事詳細下部に表示されるコンポーネントです。\n * ここでは、表示している記事に関連した他の記事3件が表示される予定です\n * @constructor\n */\nconst ColumnRelationCards0002 = () => {\n  const routePram = useRouteParam('/column/details/C0003/')\n\n  return (\n    <Wrapper>\n      <ColumnH1 label=\"関連コラム\" />\n      <section>\n        <ColumnBtnCard\n          href={routePram}\n          imgId=\"c0003.jpg\"\n          label=\"勤怠管理システムを導入したい！メリットや気を付けるべき点とは\"\n          date=\"2022.04.15\"\n        />\n      </section>\n    </Wrapper>\n  )\n}\n\nexport default ColumnRelationCards0002\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport WingSvg from '../atoms/wingSvg'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.article`\n  position: relative;\n  margin-bottom: 30px;\n  font-size: 16px;\n\n  h1 {\n    border-bottom: solid 2px #243650;\n    position: relative;\n    display: inline-block;\n    width: auto;\n    padding: 0 6px 2px 0;\n    margin-bottom: 10px;\n\n    .svg-icon {\n      width: 24px;\n      height: 24px;\n      position: absolute;\n      right: -22px;\n      bottom: -3px;\n    }\n  }\n\n  section {\n    display: flex;\n    padding: 20px 25px 20px 20px;\n    background: #f2faf9;\n    border-radius: 5px;\n    justify-content: space-between;\n\n    h2 {\n      font-size: 22px;\n      color: #ff9600;\n      display: flex;\n      align-items: center;\n      margin-bottom: 15px;\n\n      img {\n        width: 65px;\n        margin: 0 5px 0 0;\n        height: auto;\n      }\n    }\n\n    p {\n      margin: 0 0 5px 5px;\n    }\n\n    .p-function-link {\n      position: relative;\n      top: 9px;\n      right: 2px;\n      left: 20px;\n\n      &:before {\n        display: block;\n        content: '';\n        position: absolute;\n        width: 0;\n        height: 0;\n        top: 5px;\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    .p-screen-wrap {\n      width: 260px;\n      height: auto;\n      margin: 5px 5px 0;\n\n      img {\n        width: 100%;\n        box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);\n      }\n    }\n  }\n`\n\n/**\n * コラム記事下部：キンクラの便利な機能レイアウト_マイデータ\n */\nconst usefulFunctionLayout005 = () => (\n  <Wrapper>\n    <h1>\n      キンクラの便利な機能\n      <WingSvg />\n    </h1>\n    <section>\n      <div>\n        <h2>\n          <img\n            src=\"/images/official/function/imgFunction37.png\"\n            alt=\"キンクラのマイデータ\"\n          />\n          マイデータ\n        </h2>\n        <p>\n          自身が提出した勤怠申請の他、有給など自身の休暇残日数を確認できます。\n        </p>\n        <Link className=\"p-function-link\" to={useRouteParam('/function/')}>\n          キンクラの機能を見る\n        </Link>\n      </div>\n      <div className=\"p-screen-wrap\">\n        <img\n          src=\"/images/column/functions/f005.jpg\"\n          alt=\"キンクラのマイデータ\"\n        />\n      </div>\n    </section>\n  </Wrapper>\n)\n\nexport default usefulFunctionLayout005\n","import styled from '@emotion/styled'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport ColumnH1 from '../atoms/columnH1'\nimport Introduction003 from './Introduction003'\n\nconst Wrapper = styled.article`\n  position: relative;\n  margin-bottom: 30px;\n  .p-txt-date {\n    margin-top: -10px;\n    color: #ababab;\n  }\n  section {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    font-size: 16px;\n    color: #505050;\n    line-height: 1.6em;\n    h1 {\n      color: #414141;\n      font-size: 22px;\n      line-height: 1.4em;\n      background: #f5f5f5;\n      border-radius: 3px;\n      position: relative;\n      width: 100%;\n      padding: 5px 5px 5px 20px;\n      margin-bottom: 30px;\n      margin-top: 10px;\n      &:before {\n        content: '';\n        position: absolute;\n        width: 10px;\n        background: #77d7c9;\n        left: 0;\n        top: 0;\n        border-radius: 3px 0 0 3px;\n        height: 100%;\n      }\n    }\n    h2 {\n      color: #414141;\n      font-size: 22px;\n      line-height: 1.4em;\n      background: #ffffff;\n      border-radius: 3px;\n      position: relative;\n      width: 100%;\n      padding: 5px 5px 5px 20px;\n      margin-top: 10px;\n      margin-bottom: 30px;\n      &:before {\n        content: '';\n        position: absolute;\n        width: 10px;\n        background: #d8d8d8;\n        left: 0;\n        top: 0;\n        border-radius: 3px 0 0 3px;\n        height: 100%;\n      }\n    }\n    h3 {\n      color: #414141;\n      font-size: 16px;\n      line-height: 1.4em;\n      background: #ffffff;\n      width: auto;\n      padding: 10px 0 8px;\n      margin-top: -10px;\n      margin-bottom: 20px;\n      border-top: solid 2px #e5e5e5;\n      border-bottom: solid 2px #e5e5e5;\n    }\n    p {\n      padding-bottom: 30px;\n      line-height: 2;\n      position: relative;\n      span {\n        background: linear-gradient(transparent 60%, #ff6 60%);\n        font-weight: 600;\n      }\n      .p-list-link {\n        position: absolute;\n        top: 6px;\n        right: 2px;\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    .link-div {\n      width: 100%;\n      display: flex;\n      justify-content: left;\n      padding-bottom: 30px;\n      > div {\n        width: 50px;\n      }\n      .link-p {\n        width: calc(100% - 100px);\n        .p-list-link {\n          position: absolute;\n          top: -3px;\n          left: 30px;\n          &:before {\n            display: block;\n            content: '';\n            position: absolute;\n            width: 0;\n            height: 0;\n            top: 11px;\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    img {\n      width: 100%;\n      height: auto;\n      padding-bottom: 30px;\n    }\n  }\n  ${BreakPoints.large} {\n  }\n`\n\n/**\n * コラム記事詳細：記事本体\n * @constructor\n */\nconst ColumnDetailInner0009 = () => (\n  <Wrapper>\n    <ColumnH1 label=\"テレワークと通常時の業務における勤怠管理の必要性と問題点とは？\" />\n    {/** TODO 川上申し送り事項：▼投稿日をここに表示 */}\n    <p className=\"p-txt-date\">2022.04.15</p>\n    <section>\n      {/** TODO 川上申し送り事項：▼記事投稿（？）で作成された内容がここに入る予定 */}\n      <p>\n        新型コロナウイルス感染拡大防止の観点からテレワークの定着が一気に加速しました。しかし、テレワーク一択というわけにはいかず、通常の対面業務との\n        <span>ハイブリッド型</span>で労務管理する企業が増えています。\n        <br />\n        今回はテレワークと通常時の業務における勤怠管理にフォーカスをあて解説していきます。\n      </p>\n      <img src=\"/images/column/details/c0009.jpg\" alt=\"キンクラコラム画像9\" />\n      <h1>勤怠管理の必要性と問題点</h1>\n      <p>\n        勤怠管理の必要性を挙げる場合、最も重要な部分として、労働者にとって生活への影響度が高い労働条件である賃金と密接に関わっていることです。例えば遅刻早退、時間外労働があった際には、前者は欠勤控除をかけ、後者は残業代の支払いとなります。\n        <br />\n        勤怠は賃金を計算するにあたって計算の根拠となるものであり、併せて、労働法制上も客観的な方法で労働時間の管理が求められています。\n        <br />\n        <br />\n        勤怠管理の問題点として、労働時間の概念がない<span>「管理監督者」</span>\n        は勤怠管理不要との認識を持っている企業がありますが、そのようなことはなく、単に賃金計算において残業代の支払いがないことと、日々何時間程度働いているのかの記録を残すことは目的が異なります。後者は健康管理を把握する意味でも欠かすことはできません。\n        <br />\n        管理監督者であっても生身の人間であり、会社にどれくらい在社しているのか等の記録がない状態では、万が一、過労により働けなくなった場合に、会社として責任を問われることとなります。\n      </p>\n      <h1>テレワーク時の勤怠管理</h1>\n      <p>\n        テレワークとは離れた場所で働くことを指しているに過ぎず、会社からの指揮命令は存在し、\n        <span>労働者は会社が求める労務の提供</span>\n        をしなければなりません。よって、始業および終業の時刻、休憩時間の記録は必要です。\n        <br />\n        問題点としては、テレワークの形態が自宅の場合、周囲から完全に孤立しており、始業時刻や終業時刻が労働者の裁量によって、変動しやすいことです。また、直接的な周囲のサポートや注意もないことから、気づいたときには深夜帯に入って業務を行っていたというケースもあります。\n        <br />\n        <span>時間外労働</span>\n        とは特定の時間の長さを指すことであり、1日8時間・週40時間を超えた分の労働に対して割増賃金を支払う構造になっています。しかし、深夜労働とは22時から翌朝5時までの特定の時間帯を指しており、時間の長さによって割増賃金を支払うという構造ではないため、その時間帯に業務を行うと割増賃金を支払わなければならないということです。\n        <br />\n        <br />\n        テレワークの場合、性格的にルーズな従業員の場合、許可なく深夜帯に業務をすることのないよう繰り返し、指導しておく必要があります。\n        <br />\n        <br />\n        次に、テレワークを自宅で行う場合、主目的が生活を営む場で業務を行うことから、突発的に中抜けが発生することがあります。その場合、中抜け時間は労働時間ではありませんので、賃金支払い義務は生じません。\n        <br />\n        実務上、中抜け時間が発生した場合、事前の労使間での取り決めで、終業時刻を後ろにずらすことや、中抜け時間を休憩時間として扱うこと、時間単位の有給休暇として扱うことなどが挙げられますが、合意だけでなく、勤怠管理上も判別ができなければ管理が行き届いているとは言えません。\n        <br />\n        多くの場合、テレワークではクラウド型の勤怠管理ソフトを導入することが増えていますが、複数日続けて打刻がされていない場合等、不自然な打刻が確認できる場合は、アラート表示が出る機能を設けておくなどの対策が必要です。\n      </p>\n      <Introduction003 />\n      <h1 className=\"read\">通常勤務時の勤怠管理</h1>\n      <p>\n        通常勤務の場合、選択肢としては使用者が自ら現認することにより確認する方法もありますが、現認するには常に使用者が労働者よりも早く出社し、遅く帰社しなければ現認できませんので、現実的な方法とは言えません。\n        <br />\n        次の選択肢としては客観的な記録で確認することとなります。これはテレワーク時であっても同様に一例として、クラウド型の勤怠管理システムを活用して記録する方法が挙げられますが、多くの会社で採用されている選択肢と言えます。\n        <br />\n        通常勤務時の勤怠管理について、（テレワークであれば起こりにくい現象ですが）通常勤務時は周囲で勤務する労働者との雑談により、退勤時刻が遅くなることです。賃金は労働時間に対して支払うもので、雑談のような滞留時間に対して発生するものではありません。\n        <br />\n        しかし、勤怠記録には時刻だけしか記録されないのが一般的ですので、その時間が労働時間なのか滞留時間なのかは労働者から申告を受けなければ判断できない場合も少なくありません。よって、業務終業後には速やかに帰宅し、賃金は労働時間に対して支払う旨を確認の意味で周知するなどの対応が求められます。\n      </p>\n      <h1>最後に</h1>\n      <p>\n        在宅・通常に関わらず、前述したような理由で、どんな記録方法であっても実働と打刻時間の乖離が発生することがあります。よって、打刻の他にPCのログイン・ログアウト記録等を\n        <span>定期的に確認できるような仕組み</span>\n        を整え、適切な運用が出来ていない場合には、管理者からヒアリングをするなど対応が適切です。\n      </p>\n    </section>\n  </Wrapper>\n)\n\nexport default ColumnDetailInner0009\n","import { graphql } from 'gatsby'\nimport React from 'react'\nimport ColumnBackAndForth from '../../../components/atoms/columnBackAndForth'\nimport SEO from '../../../components/atoms/seo'\nimport { ITopicPath } from '../../../components/atoms/topicPath'\nimport ColumnAuthor001 from '../../../components/molecules/columnAuthor001'\nimport ColumnDetailInner0009 from '../../../components/molecules/columnDetailInner0009'\nimport ColumnRelationCards0002 from '../../../components/molecules/columnRelationCards0002'\nimport UsefulFunctionLayout005 from '../../../components/molecules/usefulFunctionLayout005'\nimport ColumnDetailsBody from '../../../components/organisms/columnDetailsBody'\nimport ColumnLayout from '../../../components/organisms/columnLayout'\nimport useRouteParam from '../../../hooks/useRouteParam'\n\n/**\n * コラム記事詳細画面\n * @constructor\n */\nconst C0009 = () => {\n  const paths: ITopicPath[] = [\n    { title: 'キンクラコラムTOP', link: useRouteParam('/column') },\n    { title: 'コラム記事一覧', link: useRouteParam('/column/list') },\n    {\n      title: 'テレワークと通常時の勤怠管理、それぞれ気を付けることとは？',\n    },\n  ]\n\n  return (\n    <ColumnLayout paths={paths}>\n      <SEO\n        title=\"テレワークと通常時の業務における勤怠管理の必要性と問題点とは？\"\n        description=\"テレワークという働き方の定着が加速し、最近では通常勤務とのハイブリット型が増えてきました。それぞれにおける勤怠管理の必要性と気を付けるべき点を解説します。\"\n        ogUrl=\"https://kintaicloud.jp/column/details/C0009/\"\n        ogType=\"article\"\n        ogTitle=\"テレワークと通常時の業務における勤怠管理の必要性と問題点とは？\"\n        ogDescription=\"テレワークという働き方の定着が加速し、最近では通常勤務とのハイブリット型が増えてきました。それぞれにおける勤怠管理の必要性と気を付けるべき点を解説します。\"\n        ogSiteName=\"キンクラ - 客先常駐特化型のクラウド勤怠管理システム\"\n        ogImage=\"https://www.kintaicloud.jp/images/column/details/c0009.jpg\"\n      />\n      <ColumnDetailsBody>\n        {/** 記事本体 */}\n        <ColumnDetailInner0009 />\n        {/** オーサ情報 */}\n        <ColumnAuthor001 />\n        {/** お役立ち機能 */}\n        <UsefulFunctionLayout005 />\n        {/** 前後記事への遷移 */}\n        <ColumnBackAndForth />\n        {/** 関連記事 */}\n        <ColumnRelationCards0002 />\n      </ColumnDetailsBody>\n    </ColumnLayout>\n  )\n}\n\nexport default C0009\n\nexport const pageQuery = graphql`\n  query C0009 {\n    site {\n      siteMetadata {\n        title\n      }\n    }\n  }\n`\n"],"names":["StyledLink","Link","props","className","to","href","src","imgId","alt","label","date","Wrapper","BreakPoints","useRouteParam","target","rel","routePram","Introduction003","paths","title","link","description","ogUrl","ogType","ogTitle","ogDescription","ogSiteName","ogImage"],"sourceRoot":""}