{"version":3,"file":"component---src-pages-column-details-c-0021-tsx-eb69ffe9b78567a15c4e.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/usefulFunctionLayout019.tsx","webpack://beaver-help/./src/components/molecules/columnDetailInner0021.tsx","webpack://beaver-help/./src/components/molecules/columnRelationCards0021.tsx","webpack://beaver-help/./src/pages/column/details/C0021.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 { 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 * @constructor\n */\nconst usefulFunctionLayout019 = () => (\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      {/*\n      <div className=\"p-screen-wrap\">\n        <img src=\"/images/column/functions/f007.jpg\" alt=\"キンクラの残業管理\" />\n      </div> */}\n    </section>\n  </Wrapper>\n)\n\nexport default usefulFunctionLayout019\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\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      &.txt-color-red {\n        color: #ff6969;\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% - 50px);\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 ColumnDetailInner0021 = () => (\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        <br />\n        今回は労働法制上、<span>唯一賃金支払い義務が課せられる</span>\n        有給付与について、掘り下げて解説してまいります。\n      </p>\n      <img src=\"/images/column/details/c0021.jpg\" alt=\"キンクラコラム画像21\" />\n      <h1>年次有給休暇が付与される要件とは</h1>\n      <p>\n        労働基準法第39条1項では職場に雇入れた日から起算して\n        <span>6か月継続勤務し、8割以上出勤</span>\n        した労働者に対して10日付与されます。これは最低基準であり、これを下回ることはできません（パートなどで労働契約の前提となる出勤日数が少ない場合は10日より少ない日数で付与）。尚、「継続勤務」の考え方は労働契約自体が存続している場合は通算して考えます。\n        <br />\n        例えば定年退職後再雇用された場合や休職期間中であっても継続勤務として扱うということです。よって、雇入れ当初が全員同じということは稀であり、個人ごとにいつ有給休暇が付与されるのかは異なることから、人が増えるごとに管理は煩雑になると言えるでしょう。また、「8割以上」の考え方については「全労働日」の8割以上と考えます。\n        <br />\n        <br />\n        全労働日とは端的には労働者として働くべき日（所定労働日）という趣旨であり、休日は除きます。\n      </p>\n      <h1>年次有給休暇の対象者</h1>\n      <p>\n        正社員はもちろんパートやアルバイトなど（呼称は会社によって異なる）であっても付与される対象者に含まれます。派遣労働者に対しては労働契約の締結は派遣元企業と派遣労働者の間で取り交わすことから\n        <span>派遣元企業との間で存在する付与要件に沿って有給休暇が付与</span>\n        されます。しかし、実務上は労務の提供先は派遣先企業であることから派遣先企業の所属長と派遣労働者との間でコミュニケーションを取り（繁忙期であれば尚更）取得日を決めることとなります。\n      </p>\n      <h1>付与される日数</h1>\n      <p>\n        いわゆる正社員であれば\n        <span>6か月経過時に（出勤率に問題がなければ）10日が付与</span>\n        されます。尚、有給休暇の時効は2020年4月の法改正後も2年が維持されています（残業代は3年に延長）。また、「比例付与」と言い、下記の2つの要件に当てはまる場合は、10日より少ない日数で付与しても違法ではありません。\n        <br />\n        <br />\n        比例付与\n        <br />\n        ・週の所定労働時間が30時間未満\n        <br />\n        かつ\n        <br />\n        ・就の所定労働日数が4日以下または年間の所定労働日数が216日以下\n      </p>\n      <div className=\"link-div\">\n        参考\n        <p className=\"link-p\">\n          <Link\n            className=\"p-list-link\"\n            to=\"https://www.mhlw.go.jp/new-info/kobetu/roudou/gyousei/dl/140811-3.pdf\"\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            厚生労働省\n          </Link>\n        </p>\n      </div>\n      <p className=\"txt-color-red\">\n        尚、契約変更により年度の途中で労働者の所定労働日数が変更となった場合、対象者の残有給休暇日数を即座に増減する必要はありません。有給休暇は「基準日」において発生することから、次回の基準日に変更後の契約にあわせた日数を付与します。\n      </p>\n      <Introduction003 />\n      <h1>年次有給休暇の付与の仕方（通常とは異なる付与の仕方等）</h1>\n      <h2>時間単位年休</h2>\n      <p>\n        本来、有給休暇は労働者の心身のリフレッシュ等を目的に設けられており、原則として\n        <span>「暦日」を単位とした取得</span>が想定されています。\n        <br />\n        しかし、労働者の中には暦日単位よりも時間単位の方が取得しやすいという諸般の事情もあり、\n        <span>法律上は5日以内に限り、時間単位の取得も認められています。</span>\n        <br />\n        実務上は労使協定の締結が必要となりますが、所轄労働基準監督署への届出は不要です。\n      </p>\n      <h2>計画的付与</h2>\n      <p>\n        端的に言うと、<span>会社が有給休暇の取得日を決める</span>\n        ことです。例えば当初会社としての休日として定められていた年末年始の休日の前後にプラス1日で有給休暇を付与（計画的付与）するなどの活用例が挙げられます。実務上は労使協定を締結しますが、時間単位年休と同様に所轄労働基準監督署への届出は不要です。\n        <br />\n        <br />\n        付与できる日数は各労働者の繰り越し分も含めた有給休暇残日数の5日を超える部分が付与できる日数となります。例えば有給休暇が10日ある労働者の場合は5日、12日ある場合は7日まで計画的付与の対象とすることができます。\n        <br />\n        しかし、留意点として計画的付与の対象となる有給休暇の日数が不足している場合や請求権のない労働者も含めて計画的付与を行う場合は、付与日数を増やすなどの措置を取る必要があります。他には、計画的付与を個人別や班別に付与することも可能です。\n      </p>\n      <h2>時季指定義務</h2>\n      <p>\n        2019年4月1日から有給休暇が年10日以上\n        <span>\n          付与される労働者に対して付与日から1年以内に5日取得させることが義務化\n        </span>\n        されました。尚、労働者が様々な理由により有給休暇を請求しない場合であっても年に5日は消化させる必要があることから労働者の希望を聴取し、取得時季を指定することが求められます。当然「年10日以上」付与される労働者が対象となることから、比例付与対象者であっても一部を除き対象となります。\n      </p>\n      <h1 className=\"read\">最後に</h1>\n      <p>\n        有給休暇は前提となる考え方として要件を満たした労働者に対して法律上当然に権利が発生するものであり、一部を除きどのような理由で取得するのか会社が干渉できる余地はありません。しかし、複数の労働者が繁忙期かつ同じ日に取得が重なった場合は「時季変更権」と言い、他の時季に休暇を与えることができます。\n        <br />\n        時季変更権の行使は<span>「事業の正常な運営を妨げる」場合</span>\n        に行使でき、どのような場合も行使できるわけではありませんので、留意しておきたい部分です。\n      </p>\n    </section>\n  </Wrapper>\n)\n\nexport default ColumnDetailInner0021\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: start;\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 ColumnRelationCards0021 = () => {\n  const routePram = useRouteParam('/column/details/C0022/')\n  const routePram2 = useRouteParam('/column/details/C0023')\n  const routePram3 = useRouteParam('/column/details/C0034')\n  return (\n    <Wrapper>\n      <ColumnH1 label=\"関連コラム\" />\n      <section>\n        <ColumnBtnCard\n          href={routePram}\n          imgId=\"c0022.jpg\"\n          label=\"有給休暇の取得義務化！企業がするべき対応やポイントとは\"\n          date=\"2022.04.15\"\n        />\n        <ColumnBtnCard\n          href={routePram2}\n          imgId=\"c0023.jpg\"\n          label=\"アルバイトやパートにも有給休暇がある！付与日数や条件は？\"\n          date=\"2022.04.15\"\n        />\n        <ColumnBtnCard\n          href={routePram3}\n          imgId=\"c0034.jpg\"\n          label=\"有給休暇がもらえない？休職時における有給休暇の付与について\"\n          date=\"2022.09.12\"\n        />\n      </section>\n    </Wrapper>\n  )\n}\n\nexport default ColumnRelationCards0021\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 ColumnDetailInner0021 from '../../../components/molecules/columnDetailInner0021'\nimport ColumnRelationCards0021 from '../../../components/molecules/columnRelationCards0021'\nimport UsefulFunctionLayout019 from '../../../components/molecules/usefulFunctionLayout019'\nimport ColumnDetailsBody from '../../../components/organisms/columnDetailsBody'\nimport ColumnLayout from '../../../components/organisms/columnLayout'\nimport useRouteParam from '../../../hooks/useRouteParam'\n\n/**\n * コラム記事詳細画面\n * @constructor\n */\nconst C0021 = () => {\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=\"年次有給休暇とは唯一賃金支払い義務が課せられる休暇です。6か月継続勤務し8割以上出勤した労働者に対して10日付与されます。正社員やパートやアルバイトも対象です。\"\n        ogUrl=\"https://kintaicloud.jp/column/details/C0021/\"\n        ogType=\"article\"\n        ogTitle=\"年次有給休暇とは？付与の条件や日数、時期などを詳しく解説\"\n        ogDescription=\"年次有給休暇とは唯一賃金支払い義務が課せられる休暇です。6か月継続勤務し8割以上出勤した労働者に対して10日付与されます。正社員やパートやアルバイトも対象です。\"\n        ogSiteName=\"キンクラ - 客先常駐特化型のクラウド勤怠管理システム\"\n        ogImage=\"https://www.kintaicloud.jp/images/column/details/c0021.jpg\"\n      />\n      <ColumnDetailsBody>\n        {/** 記事本体 */}\n        <ColumnDetailInner0021 />\n        {/** オーサ情報 */}\n        <ColumnAuthor001 />\n        {/** お役立ち機能 */}\n        <UsefulFunctionLayout019 />\n        {/** 前後記事への遷移 */}\n        <ColumnBackAndForth />\n        {/** 関連記事 */}\n        <ColumnRelationCards0021 />\n      </ColumnDetailsBody>\n    </ColumnLayout>\n  )\n}\n\nexport default C0021\n\nexport const pageQuery = graphql`\n  query C0021 {\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","Introduction003","routePram","routePram2","routePram3","paths","title","link","description","ogUrl","ogType","ogTitle","ogDescription","ogSiteName","ogImage"],"sourceRoot":""}