{"version":3,"file":"component---src-pages-column-details-c-0063-tsx-010aef62f239d5c013f1.js","mappings":"0KAKMA,GAAO,6uBAoETC,EAAAA,EAAAA,MApES,MAuGb,IA3BwB,kBACtB,QAACD,EAAD,MAEE,wBACE,eAAKE,IAAI,kCAAkCC,IAAI,WAC/C,eAAKC,UAAU,gBACb,aAAGA,UAAU,eAAb,SACO,mCAEP,aAAGA,UAAU,eACX,QAAC,EAAAC,KAAD,CACEC,GAAG,kCACHC,OAAO,SACPC,IAAI,cAHN,iBADF,iBAYJ,eAAKJ,UAAU,cAAf,kK,qECjGJ,IAAMJ,GAAO,mbAiGb,IA/DoB,WAClB,OAAwBS,EAAAA,EAAAA,WAAkB,GAAnCC,EAAP,KAAaC,EAAb,KAEMC,EAAa,WACbC,OAAOC,YANO,KAOhBH,GAAQ,GAERA,GAAQ,IAIZ,GAA8BF,EAAAA,EAAAA,WAAS,GAAhCM,EAAP,KAAgBC,EAAhB,MAEAC,EAAAA,EAAAA,YAAU,WAER,OADAJ,OAAOK,iBAAiB,SAAUN,GAC3B,kBAAMC,OAAOM,oBAAoB,SAAUP,MACjD,IAEH,OAAoBH,EAAAA,EAAAA,WAAU,GAAvBW,EAAP,KAAWC,EAAX,MACAJ,EAAAA,EAAAA,YAAU,WACRI,EAAMC,KAAKC,MAAsB,EAAhBD,KAAKE,aACrB,IAEH,IAAMC,GAAaC,EAAAA,EAAAA,GACjB,oGAEIC,GAAcD,EAAAA,EAAAA,GAClB,oGAGF,OAAIhB,GAEA,QAACV,EAAD,CAAS4B,MAAO,CAAEC,WAAYd,EAAU,UAAY,WAC1C,IAAPK,IACC,oBACE,aAAGb,OAAO,SAASuB,KAAML,EAAYjB,IAAI,eACvC,eACEN,IAAI,0CACJC,IAAI,WAKJ,IAAPiB,IACC,oBACE,aAAGb,OAAO,SAASuB,KAAMH,EAAanB,IAAI,eACxC,eACEN,IAAI,0CACJC,IAAI,YAOZ,aAAGC,UAAU,cAAc2B,QAAS,kBAAMf,GAAYD,KAAtD,MAKC,O,2FC7FT,IAAMf,GAAO,y7BAgHb,IA5BgC,kBAC9B,QAACA,EAAD,MACE,gCAEE,QAAC,IAAD,QAEF,wBACE,oBACE,mBACE,eACEE,IAAI,8CACJC,IAAI,iBAHR,YAOA,iDACA,QAAC,EAAAE,KAAD,CAAMD,UAAU,kBAAkBE,IAAIoB,EAAAA,EAAAA,GAAc,eAApD,mB,sPC5FF1B,GAAO,kzDAsITC,EAAAA,EAAAA,MAtIS,MAiOb,EA/E8B,SAAC+B,GAAD,OAC5B,QAAChC,EAAD,MACE,QAAC,IAAD,CAAUiC,MAAM,8CAEhB,aAAG7B,UAAU,cAAb,eACA,wBAEE,mJACkI,MAElI,eAAKF,IAAI,mCAAmCC,IAAI,iBAChD,cAAI+B,GAAG,QAAP,WACA,yKAIA,cAAIA,GAAG,QAAP,WACA,sEAEE,iDAFF,iEAOc,IAAbF,EAAMZ,KAAY,QAACe,EAAA,EAAD,MACL,IAAbH,EAAMZ,KAAY,QAACgB,EAAA,EAAD,MACL,IAAbJ,EAAMZ,KAAY,QAACiB,EAAA,EAAD,MACL,IAAbL,EAAMZ,KAAY,QAACkB,EAAA,EAAD,MACL,IAAbN,EAAMZ,KAAY,QAACmB,EAAA,EAAD,MACL,IAAbP,EAAMZ,KAAY,QAACoB,EAAA,EAAD,MACL,IAAbR,EAAMZ,KAAY,QAACqB,EAAA,EAAD,MACL,IAAbT,EAAMZ,KAAY,QAACsB,EAAA,EAAD,MACL,IAAbV,EAAMZ,KAAY,QAACuB,EAAA,EAAD,OAEnB,cAAIT,GAAG,QAAP,wBACA,kJAEE,2CAFF,gHAIE,uGAJF,gOAUA,cAAIA,GAAG,QAAP,qBACA,6JAEE,6CAFF,OAGE,oBACA,mBAJF,OAKK,8CALL,2EAOE,oBACA,mBARF,MAUE,oEAVF,4JAgBA,cAAIA,GAAG,QAAP,+BACA,uMAEE,gFAFF,kLAQA,cAAIA,GAAG,QAAP,QACA,kL,+JClJN,EA5Dc,WACZ,IAUA,GAAoBzB,EAAAA,EAAAA,WAAU,GAAvBW,EAAP,KAAWC,EAAX,KAKA,OAJAJ,EAAAA,EAAAA,YAAU,WACRI,EAAMC,KAAKC,MAAsB,EAAhBD,KAAKE,aACrB,KAGD,QAAC,IAAD,CAAcoB,MAhBY,CAC1B,CAAEC,MAAO,aAAcC,KAAM,WAC7B,CAAED,MAAO,UAAWC,KAAM,gBAC1B,CACED,MACE,+CAYF,QAAC,IAAD,CACEA,MAAM,2CACNE,YAAY,oEACZC,MAAM,+CACNC,OAAO,UACPC,QAAQ,2CACRC,cAAc,oEACdC,WAAW,8BACXC,QAAQ,gEAEV,QAAC,IAAD,MAEE,QAAC,IAAD,OAEA,QAAC,EAAD,CAAuBjC,GAAIA,IAGnB,IAAPA,IAAY,QAACkC,EAAA,EAAD,MACL,IAAPlC,IAAY,QAACmC,EAAA,EAAD,MACL,IAAPnC,IAAY,QAACoC,EAAA,EAAD,MACL,IAAPpC,IAAY,QAACqC,EAAA,EAAD,MACL,IAAPrC,IAAY,QAACsC,EAAA,EAAD,MACL,IAAPtC,IAAY,QAACuC,EAAA,EAAD,MACL,IAAPvC,IAAY,QAACwC,EAAA,EAAD,MACL,IAAPxC,IAAY,QAACyC,EAAA,EAAD,MACL,IAAPzC,IAAY,QAAC0C,EAAA,EAAD,OAGb,QAAC,IAAD,OAEA,QAAC,IAAD,OAEA,QAAC,IAAD,OAEA,QAAC,IAAD","sources":["webpack://beaver-help/./src/components/molecules/columnAuthor001.tsx","webpack://beaver-help/./src/components/molecules/popupBanner.tsx","webpack://beaver-help/./src/components/molecules/usefulFunctionLayout015.tsx","webpack://beaver-help/./src/components/molecules/columnDetailInner0063.tsx","webpack://beaver-help/./src/pages/column/details/C0063.tsx"],"sourcesContent":["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 \n {/** TODO 川上申し送り事項:▼記事投稿(?)で作成された内容がここに入る予定 */}\n
\n \"蓑田\n
\n

\n 蓑田 真吾(ミノダ シンゴ)\n

\n

\n \n みのだ社会保険労務士事務所\n \n 代表 社会保険労務士\n

\n
\n
\n
\n 社会保険労務士(社労士)独立後は労務トラブルが起こる前の事前予防対策に特化。現在は様々な労務管理手法を積極的に取り入れ企業の人事労務業務をサポートしている。また、年金・医療保険に関する問題や労働法・働き方改革関する専門家として、実務相談を多く取り扱い、大手出版社からも書籍出版するなど、多方面で執筆活動を行う。\n
\n
\n)\n\nexport default columnAuthor001\n","import React, { useEffect, useState } from 'react'\nimport styled from '@emotion/styled'\nimport { a } from 'aws-amplify'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.div`\n position: fixed;\n bottom: 100px;\n left: 30px;\n width: 300px;\n height: 250px;\n z-index: 100;\n img {\n height: 250px;\n width: 300px;\n border: 2px solid #e5e5e5;\n }\n .popup-close {\n position: absolute;\n top: -10px;\n right: -10px;\n width: 29px;\n height: 29px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #fff;\n border-radius: 50%;\n border: solid 2px #e5e5e5;\n text-decoration: none;\n &:hover {\n text-decoration: none;\n }\n }\n`\n\n// ▼ここで何ピクセルスクロールしたら表示するのかを設定してね\nconst PAGE_Y_OFFSET = 1500\n\nconst PopupBanner = () => {\n const [show, setShow] = useState(false)\n\n const changeShow = () => {\n if (window.pageYOffset > PAGE_Y_OFFSET) {\n setShow(true)\n } else {\n setShow(false)\n }\n }\n\n const [visible, setVisible] = useState(true)\n\n useEffect(() => {\n window.addEventListener('scroll', changeShow)\n return () => window.removeEventListener('scroll', changeShow)\n }, [])\n\n const [no, setNo] = useState(-1)\n useEffect(() => {\n setNo(Math.floor(Math.random() * 2))\n }, [])\n\n const routeParam = useRouteParam(\n 'https://www.kintaicloud.jp/contact/?utm_source=column&utm_medium=popup&utm_campaign=popup_202301'\n )\n const routeParam2 = useRouteParam(\n 'https://www.kintaicloud.jp/contact/?utm_source=column&utm_medium=popup&utm_campaign=popup_202302'\n )\n\n if (show)\n return (\n \n {no === 0 && (\n
\n \n \n \n
\n )}\n {no === 1 && (\n
\n \n \n \n
\n )}\n {/** ▼閉じるボタン */}\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n setVisible(!visible)}>\n ×\n \n
\n )\n return null\n}\n\nexport default PopupBanner\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 usefulFunctionLayout015 = () => (\n \n

\n キンクラの便利な機能\n \n

\n
\n
\n

\n \n 給与ソフト連携\n

\n

給与ソフトにあわせたエクスポートデータを生成できます。

\n \n キンクラの機能を見る\n \n
\n {/*\n
\n \"キンクラの残業管理\"\n
*/}\n
\n
\n)\n\nexport default usefulFunctionLayout015\n","import styled from '@emotion/styled'\nimport React from 'react'\nimport BreakPoints from '../../styles/breakPoints'\nimport ColumnH1 from '../atoms/columnH1'\nimport Introduction004 from './Introduction004'\nimport Introduction005 from './Introduction005'\nimport Introduction006 from './Introduction006'\nimport Introduction007 from './Introduction007'\nimport Introduction008 from './Introduction008'\nimport Introduction009 from './Introduction009'\nimport Introduction010 from './Introduction010'\nimport Introduction011 from './Introduction011'\nimport Introduction012 from './Introduction012'\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`\ntype Props = {\n /** 広告の番号 */\n no: number\n}\n\n/**\n * コラム記事詳細:記事本体\n * @constructor\n */\nconst ColumnDetailInner0063 = (props: Props): JSX.Element => (\n \n \n {/** TODO 川上申し送り事項:▼投稿日をここに表示 */}\n

2024.06.21

\n
\n {/** TODO 川上申し送り事項:▼記事投稿(?)で作成された内容がここに入る予定 */}\n

\n 一定以上の規模になると勤怠管理と給与計算は密接に関連することとなります。もちろん連携しない状態であっても運用自体は可能ですが、相互に連携することで相互の事務の簡素化合理化を進めることができます。今回は勤怠管理と給与計算の連携にフォーカスをあて解説します。{' '}\n

\n \"キンクラコラム画像63\"\n

勤怠管理とは

\n

\n 勤怠管理とは出退勤時刻や年次有給休暇の取得等、日々の勤怠記録のことを指します。現在、労働安全衛生法によって、企業には労働時間の客観的な把握義務が課せられており、ITツール等を活用した勤怠管理ソフトを導入することで、担当者の手間を減らしながらも集計作業が簡便になる等多くのメリットが多くあります。\n

\n\n

給与計算とは

\n

\n 言うまでもなく従業員等へ支給する給与を計算することですが、給与には大きく分けて3つの項目あります。\n 1つは勤怠項目、2つ目は支給項目、3つ目に控除項目\n があります。給与は何らかの根拠情報に基づいて支給する(または控除する)こととなり、その根拠となるものが勤怠情報となります。\n

\n\n {/** ここに9パターンの広告設定する */}\n {props.no === 0 && }\n {props.no === 1 && }\n {props.no === 2 && }\n {props.no === 3 && }\n {props.no === 4 && }\n {props.no === 5 && }\n {props.no === 6 && }\n {props.no === 7 && }\n {props.no === 8 && }\n\n

なぜ相互に連携がかかった方がよいのか?

\n

\n 従業員数が一定数を超えると様々な職種や勤務形態、個々の事情を抱えた従業員の存在が色濃くなります。例えば夜間勤務がある職種、変形労働時間制を採用する事業形態、介護や育児と並行しながら労務の提供をする労働者(突発的な休暇が多いことが想定される)に対して、\n アナログ管理ではいずれ限界が訪れます。\n 例えば紙台帳で管理するとなれば必要な情報に瞬時にアクセスすることが難しく、過去の情報を検索する際にも多くの時間を要します。特に給与計算には「給与支給日」という絶対的に遅れることができない締め切り日が存在します。また、\n \n 給与計算は勤怠情報を基に計算をするという性質上、連携がかかることで自動的に計算が可能(中には手作業が入る部分もある)となり、余裕を持った作業が可能となります。\n \n どのような業務であっても最後は人間が作業する部分があり、焦りによってミスが発生しやすくなるということは容易に想像がつきます。そこで、機械的な作業で凌げる部分は機械に委ね、人為的なミスを回避するためにも、本来人の目でチェックすべき部分に時間をより投入できるようにすることが適切です。保険料率の改定なども法令に則った情報をキャッチアップしていくのは一定の時間と労力を要しますが、現在のシステムでは法改正ごとに常にアップデートが行われています。\n

\n\n

連携時に留意すべきポイントとは?

\n

\n 自動計算が可能と言っても課題がないわけではありません。そもそも初期設定が誤っていた場合、その時点で正しい答えが算出できないということです。また、企業内のルール変更があった場合にはその変更内容に応じて設定を変えなければ誤った計算にもなりかねません。よって、多くの場合、当初の\n 初期設定にはある程度時間と労力の投入が必要です。\n
\n
\n また、データのバックアップも忘れずに行っておくべき\n です。ただし、現在はクラウド型等を始め、自動的にバックアップおよびアップデートを行ってくれるシステムも多く、より業務の効率化が実現しています。\n
\n
\n 次に\n \n 全ての勤怠情報が揃った状態でなければ連携できないという場合は作業に時間を要してしまいます\n \n (逆に紙台帳やExcelでの管理であればこのような問題はおきません)。特に部門数が多い企業では勤怠情報の確認に時間差が出てしまい、全部門が揃わないと言った事情もあります。ただし、勤怠情報の確認が終了している部門から順次連携がかけることができるシステムであればこの問題はそこまで大きな問題ではありません。\n

\n\n

勤怠システムと給与計算事務の連携による法違反回避事例

\n

\n 現在は(現時点で一部の業種で猶予中の業種も有り)企業に対して時間外労働の上限規制が課せられており、旧来は「青天井」であった時間労働時間数も法律によって上限が設定されました。また、2023年4月からは中小企業に対しても月60時間を超える時間外労働に対しては割増賃金率が25%から50%に引き上げられます。これは給与計算事務の観点でも重要な論点ですが、その前に\n \n 勤怠システムでアラート機能等が発動すれば月60時間を超えるような状態になる前に早期に注意喚起することができます。\n \n もちろん、超えた場合には当該情報が給与計算システムに連動することで誤った割増賃金率が適用されることもありませんので、相互にメリットがあると言えます。特に恒常的な時間外労働が起こっている部門については多忙ゆえに人的な注意喚起機能が働かないことが想定されるため、機械的にチェックをかけることで法違反を回避できるよう検討している企業も少なくありません。\n

\n\n

最後に

\n

\n 勤怠管理と給与計算を連携させることで人為的なミスの回避と事務の簡素化合理化が促進されます。もちろん別々に管理することで情報紛失のリスクを減らせるという声もありますが、実際にそのようなことが起こる可能性はそこまで大きくはなく、それよりも毎月必ず発生する給与計算事務の簡素化合理化に目を向ける方が肝要と言えます。\n

\n
\n
\n)\n\nexport default ColumnDetailInner0063\n","import {graphql} from 'gatsby'\nimport React, {useEffect, useState} from 'react'\nimport ColumnBackAndForth from '../../../components/atoms/columnBackAndForth'\nimport SEO from '../../../components/atoms/seo'\nimport {ITopicPath} from '../../../components/atoms/topicPath'\nimport ColumnDetailInner0063 from '../../../components/molecules/columnDetailInner0063'\nimport ColumnDetailsBody from '../../../components/organisms/columnDetailsBody'\nimport ColumnLayout from '../../../components/organisms/columnLayout'\nimport Conclusion001 from '../../../components/molecules/Conclusion001'\nimport Conclusion002 from '../../../components/molecules/Conclusion002'\nimport Conclusion003 from '../../../components/molecules/Conclusion003'\nimport Conclusion004 from '../../../components/molecules/Conclusion004'\nimport Conclusion005 from '../../../components/molecules/Conclusion005'\nimport Conclusion006 from '../../../components/molecules/Conclusion006'\nimport Conclusion007 from '../../../components/molecules/Conclusion007'\nimport Conclusion008 from '../../../components/molecules/Conclusion008'\nimport Conclusion009 from '../../../components/molecules/Conclusion009'\nimport ColumnAuthor001 from '../../../components/molecules/columnAuthor001'\nimport CarouselBanner from '../../../components/molecules/carouselBanner'\nimport PopupBanner from '../../../components/molecules/popupBanner'\nimport UsefulFunctionLayout015 from '../../../components/molecules/usefulFunctionLayout015'\n\n/**\n * コラム記事詳細画面\n * @constructor\n */\nconst C0063 = () => {\n const paths: ITopicPath[] = [\n { title: 'キンクラコラムTOP', link: '/column' },\n { title: 'コラム記事一覧', link: '/column/list' },\n {\n title:\n '勤怠管理と給与計算の連携について。なぜ連携した方がいいの?留意すべきポイントとは',\n },\n ]\n\n // 0~8ランダム数字を保存\n const [no, setNo] = useState(-1)\n useEffect(() => {\n setNo(Math.floor(Math.random() * 9))\n }, [])\n\n return (\n \n \n \n {/** ポップアップバナー */}\n \n {/** 記事本体 */}\n \n\n {/** ここに9パターンの広告設定する */}\n {no === 0 && }\n {no === 1 && }\n {no === 2 && }\n {no === 3 && }\n {no === 4 && }\n {no === 5 && }\n {no === 6 && }\n {no === 7 && }\n {no === 8 && }\n\n {/** オーサ情報 */}\n \n {/** お役立ち機能 */}\n \n {/** 前後記事への遷移 */}\n \n {/** カルーセルバナー */}\n \n {/** 関連記事 */}\n {/* */}\n \n \n )\n}\n\nexport default C0063\n\nexport const pageQuery = graphql`\n query C0063 {\n site {\n siteMetadata {\n title\n }\n }\n }\n`\n"],"names":["Wrapper","BreakPoints","src","alt","className","Link","to","target","rel","useState","show","setShow","changeShow","window","pageYOffset","visible","setVisible","useEffect","addEventListener","removeEventListener","no","setNo","Math","floor","random","routeParam","useRouteParam","routeParam2","style","visibility","href","onClick","props","label","id","Introduction004","Introduction005","Introduction006","Introduction007","Introduction008","Introduction009","Introduction010","Introduction011","Introduction012","paths","title","link","description","ogUrl","ogType","ogTitle","ogDescription","ogSiteName","ogImage","Conclusion001","Conclusion002","Conclusion003","Conclusion004","Conclusion005","Conclusion006","Conclusion007","Conclusion008","Conclusion009"],"sourceRoot":""}