{"version":3,"file":"component---src-pages-column-details-c-0067-tsx-5b0a2c7ffe97d026ccb6.js","mappings":"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","sources":["webpack://beaver-help/./src/components/molecules/popupBanner.tsx","webpack://beaver-help/./src/components/molecules/usefulFunctionLayout015.tsx","webpack://beaver-help/./src/components/molecules/columnDetailInner0067.tsx","webpack://beaver-help/./src/pages/column/details/C0067.tsx"],"sourcesContent":["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'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.article`\n position: relative;\n margin-bottom: 30px;\n\n .p-txt-date {\n margin-top: -10px;\n color: #ababab;\n }\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\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\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\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\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\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\n p {\n padding-bottom: 30px;\n line-height: 2;\n position: relative;\n\n span {\n background: linear-gradient(transparent 60%, #ff6 60%);\n font-weight: 600;\n }\n\n .p-list-link {\n position: absolute;\n top: 6px;\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 &.txt-color-red {\n color: #ff6969;\n }\n }\n\n .link-div {\n width: 100%;\n display: flex;\n justify-content: left;\n padding-bottom: 30px;\n\n > div {\n width: 50px;\n }\n\n .link-p {\n width: calc(100% - 50px);\n\n .p-list-link {\n position: absolute;\n top: -3px;\n left: 30px;\n\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\n img {\n width: 100%;\n height: auto;\n padding-bottom: 30px;\n }\n }\n\n ${BreakPoints.large} {\n }\n`\ntype Props = {\n /** 広告の番号 */\n no: number\n}\n\n/**\n * コラム記事詳細：記事本体\n * @constructor\n */\nconst ColumnDetailInner0067 = (props: Props): JSX.Element => {\n const routePram = useRouteParam('/column/details/C0002/')\n const routePram2 = useRouteParam('https://www.kintaicloud.jp/')\n const routePram3 = useRouteParam('https://www.kintaicloud.jp/')\n return (\n \n \n {/** TODO 川上申し送り事項：▼投稿日をここに表示 */}\n

2023.09.27

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

\n 勤怠管理と経費精算は、多くの企業にとって煩雑な業務です。紙での申請やExcelを使用する従来の方法は、ミスによる差し戻しなど、効率性を損なうことが多くありました。しかし、最近では\n \n クラウドサービスの普及により、これらの業務を効率的に管理できる新たな解決策\n \n が提供されています。\n
\n クラウド勤怠管理システムにより、自動化や決まったフォームへの入力が可能となり、\n 従業員の勤怠情報や経費精算がスピーディーかつ正確に入力\n できます。また、勤怠ルールや経費精算ルールの厳守をサポートし、\n 企業の業務プロセスを劇的に向上させることができます。\n
\n
\n そこでこの記事では、クラウドサービスの活用を通じて、勤怠管理と経費精算を効率化する方法について紹介します。\n

\n

そもそもクラウド勤怠管理システムとはなにか？

\n

\n そもそもクラウド勤怠管理システムとはどのようなものでしょうか？クラウド勤怠管理について詳しく説明します。\n

\n

クラウド勤怠管理システムとは

\n

\n クラウド勤怠管理システムは、企業の\n 従業員の勤怠データや経費精算をリアルタイムで一元管理\n できるWebサービスです。\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

\n 勤怠管理システムを導入するなら、\n 経費精算の機能が付いたクラウド型の勤怠管理システム\n を導入することをお勧めします。その理由について、解説していきます。\n

\n

コストを低く抑えることができる

\n

\n クラウド型の勤怠管理システムは、操作性が高いものも多く、ユーザー数に応じて使用料を支払うためコストを安く抑えることができます。\n

\n

時間削減と労働力コストの軽減

\n

\n 勤怠管理や経費精算の業務は、手作業で行う場合、企業の人事や経理部門に多くの時間と手間がかかります。しかし、システムを導入すれば効率化が図られ、\n 自動化やデータの集計・確認が容易になります。\n
\n また、クラウド型の勤怠管理システムはWebサービスのため、全従業員のPCに専用ソフトウェアをインストールすることなく使用できる点も利点です。\n
\n そのため、勤怠管理システムを導入する際に発生する工数を減らし、\n 導入時にかかる時間の削減も可能です。\n

\n

データの一元管理と連携による業務効率化

\n

\n 経費精算の機能の付いた勤怠管理クラウドならば、データの一元管理が可能です。\n
\n 従来のExcelや紙ベースでの管理では情報を集約する必要がありましたが、クラウド勤怠管理システムなら\n 自動で勤怠情報を集約・集計してくれます。\n
\n これにより、データの確認や入力作業が簡単になり、業務効率化が図られます。\n

\n

クラウドサービスによる手間のないメンテナンス

\n

\n クラウドサービスを利用した勤怠管理・経費精算システムは、\n 手間のかからないメンテナンス\n が特徴です。サービス提供会社がシステムのセキュリティや更新を行ってくれるため、企業側では特別な対応が不要です。\n
\n
\n このように、経費精算機能のついた勤怠管理システムを導入することでさまざまなメリットがあります。\n

\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 ・運用ルールの査定：システム運用に関するルールを策定し、徹底する。\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}\n\nexport default ColumnDetailInner0067\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 ColumnDetailInner0067 from '../../../components/molecules/columnDetailInner0067'\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 CarouselBanner from '../../../components/molecules/carouselBanner'\nimport PopupBanner from '../../../components/molecules/popupBanner'\nimport UsefulFunctionLayout015 from '../../../components/molecules/usefulFunctionLayout015'\nimport useRouteParam from '../../../hooks/useRouteParam'\n\n/**\n * コラム記事詳細画面\n * @constructor\n */\nconst C0067 = () => {\n const paths: ITopicPath[] = [\n { title: 'キンクラコラムTOP', link: useRouteParam('/column') },\n { title: 'コラム記事一覧', link: useRouteParam('/column/list') },\n {\n title: '勤怠管理は経費精算付きのクラウドがおすすめ！ その理由とは...',\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 C0067\n\nexport const pageQuery = graphql`\n query C0067 {\n site {\n siteMetadata {\n title\n }\n }\n }\n`\n"],"names":["Wrapper","useState","show","setShow","changeShow","window","pageYOffset","visible","setVisible","useEffect","addEventListener","removeEventListener","no","setNo","Math","floor","random","routeParam","useRouteParam","routeParam2","style","visibility","target","href","rel","src","alt","className","onClick","Link","to","BreakPoints","props","routePram","routePram2","routePram3","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":""}