{"version":3,"file":"static/chunks/pages/introduce-d9a41020e9ee12b2.js","mappings":"AACA","sources":["webpack://_N_E/?6627","webpack://_N_E/./src/components/TextBreak.tsx","webpack://_N_E/./src/lib/utils/newPlan.tsx","webpack://_N_E/./src/components/VideoComponent.tsx","webpack://_N_E/./src/modules/landings/introduce/components/IntroVideo.tsx","webpack://_N_E/./src/modules/landings/introduce/components/IntroFaqs.tsx","webpack://_N_E/./src/modules/landings/introduce/IntroducePage.tsx","webpack://_N_E/./src/pages/introduce.tsx","webpack://_N_E/"],"sourcesContent":["\n (window.__NEXT_P = window.__NEXT_P || []).push([\n \"/introduce\",\n function () {\n return require(\"private-next-pages/introduce.tsx\");\n }\n ]);\n if(module.hot) {\n module.hot.dispose(function () {\n window.__NEXT_P.push([\"/introduce\"])\n });\n }\n ","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n display: block;\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport styled from \"styled-components\";\nimport classNames from \"classnames\";\nconst TextBreakWrapper = styled.span.withConfig({\n componentId: \"sc-a7c8773c-0\"\n})(_templateObject());\nexport const TextBreak = (param)=>{\n let { customClassName } = param;\n return /*#__PURE__*/ _jsx(TextBreakWrapper, {\n className: classNames(\"text-break\", customClassName)\n });\n};\n","export const useNewPlanVar = process.env.NEXT_PUBLIC_FEATURES_2023_04_NEW_PLAN === \"true\";\nconst useNewPlanUI = ()=>{\n // const [useNewPlan, setUseNewPlan] = useState(false)\n // const router = useRouter()\n // useEffect(() => {\n // \tconst { query } = router\n // \tconst newPlan = query.useNewPlan\n //\n // \tif (newPlan === 'true') {\n // \t\tsetUseNewPlan(true)\n // \t}\n // }, [router.query])\n //\n const useNewPlan = process.env.NEXT_PUBLIC_FEATURES_2023_04_NEW_PLAN === \"true\";\n return {\n useNewPlan\n };\n};\nexport default useNewPlanUI;\nexport const useStudio = ()=>{\n // const [useStudio, setUseStudio] = useState(false)\n // const router = useRouter()\n //\n // useEffect(() => {\n // \tconst { query } = router\n // \tconst newPlanStudio = query.useStudio\n //\n // \tif (newPlanStudio === 'true') {\n // \t\tsetUseStudio(true)\n // \t}\n // }, [router.query])\n const useStudio = process.env.NEXT_PUBLIC_FEATURES_2023_04_STUDIO === \"true\";\n return {\n useStudio\n };\n};\nexport const usePurchaseCheck = ()=>{\n const usePurchaseCheck = process.env.NEXT_PUBLIC_FEATURES_2023_05_LICENSE_PURCHASE_CHECK === \"true\";\n return {\n usePurchaseCheck\n };\n};\nexport const useParsingBadge = ()=>{\n const useParsingBadge = process.env.NEXT_PUBLIC_FEATURES_2023_06_PARSING_BADGE === \"true\";\n return {\n useParsingBadge\n };\n};\nexport const useBuyStudio = ()=>{\n const useBuyStudio = process.env.NEXT_PUBLIC_FEATURES_2023_06_BUY_STUDIO === \"true\";\n return {\n useBuyStudio\n };\n};\nexport const ENV_NO_BASE_LICENSE_ID = ()=>{\n return {\n id: process.env.NEXT_PUBLIC_TEMP_SOURCE_ID\n };\n};\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nexport const VideoComponent = (param)=>{\n let { videoSrc , posterSrc } = param;\n return /*#__PURE__*/ _jsx(\"video\", {\n width: \"100%\",\n controls: true,\n poster: posterSrc,\n children: /*#__PURE__*/ _jsx(\"source\", {\n src: videoSrc,\n type: \"video/mp4\"\n })\n });\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n padding: 80px 0 120px;\\n background-color: #fdfdff;\\n text-align: center;\\n\\n @media (max-width: 1200px) {\\n padding: 48px 20px 96px;\\n }\\n @media (max-width: 768px) {\\n padding: 48px 0;\\n }\\n\\n .top {\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n\\n @media (max-width: 410px) {\\n display: block;\\n }\\n }\\n\\n .desc-box {\\n display: flex;\\n justify-content: space-between;\\n gap: 16px;\\n margin-top: 58px;\\n padding: 28px 64px 48px;\\n background-color: #f0fafc;\\n\\n @media (max-width: 1200px) {\\n padding-left: 16px;\\n padding-right: 16px;\\n }\\n @media (max-width: 768px) {\\n display: block;\\n padding: 8px 16px 36px;\\n margin-top: 24px;\\n }\\n\\n .desc-item {\\n width: 275px;\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n width: 100%;\\n\\n &:not(:nth-of-type(1)) {\\n margin-top: 16px;\\n }\\n }\\n\\n img {\\n }\\n\\n p {\\n color: \",\n \";\\n line-height: 1.35;\\n margin: 0;\\n }\\n\\n .title {\\n font-size: 24px;\\n font-weight: 900;\\n margin-top: 10px;\\n\\n @media (max-width: 1200px) {\\n font-size: 22px;\\n }\\n @media (max-width: 768px) {\\n font-size: 20px;\\n }\\n }\\n\\n .desc {\\n font-size: 20px;\\n font-weight: normal;\\n margin-top: 24px;\\n\\n @media (max-width: 1200px) {\\n font-size: 18px;\\n }\\n @media (max-width: 1000px) {\\n br {\\n display: none;\\n }\\n }\\n @media (max-width: 768px) {\\n font-size: 16px;\\n margin-top: 16px;\\n }\\n }\\n }\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n font-size: 48px;\\n font-weight: bold;\\n color: \",\n \";\\n text-align: center;\\n line-height: 1.35;\\n\\n @media (max-width: 1200px) {\\n font-size: 48px;\\n }\\n @media (max-width: 768px) {\\n font-size: 28px;\\n }\\n @media (max-width: 410px) {\\n font-size: 24px;\\n }\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n justify-content: center;\\n gap: 24px;\\n letter-spacing: -0.5px;\\n margin-top: 40px;\\n margin-right: 96px;\\n\\n @media (max-width: 1200px) {\\n margin-right: 0;\\n }\\n @media (max-width: 768px) {\\n margin-top: 24px;\\n\\n .ant-btn {\\n span {\\n font-size: 14px;\\n vertical-align: text-bottom;\\n }\\n }\\n }\\n @media (max-width: 410px) {\\n justify-content: end;\\n\\n a {\\n display: block;\\n width: 100%;\\n\\n .ant-btn {\\n width: 100%;\\n }\\n }\\n }\\n\"\n ]);\n _templateObject2 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject3() {\n const data = _tagged_template_literal([\n \"\\n flex: 1;\\n height: 56px;\\n color: #ffffff;\\n font-weight: bold;\\n padding: 0 32px;\\n box-shadow: none;\\n border-radius: 2px;\\n border: 0;\\n background-color: \",\n \";\\n\\n &.ant-btn-primary:not(:disabled):hover {\\n background-color: #113ac3;\\n }\\n\\n span {\\n display: inline-block;\\n vertical-align: bottom;\\n font-size: 20px;\\n font-weight: bold;\\n color: #fff;\\n }\\n\\n img {\\n display: inline-block;\\n vertical-align: text-bottom;\\n width: 24px;\\n height: 24px;\\n margin-right: 10px;\\n }\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n height: 48px;\\n padding: 0 24px;\\n\\n img {\\n vertical-align: top;\\n width: 20px;\\n height: 20px;\\n }\\n }\\n @media (max-width: 410px) {\\n img {\\n vertical-align: baseline;\\n width: 16px;\\n height: 16px;\\n margin-right: 4px;\\n }\\n }\\n\"\n ]);\n _templateObject3 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject4() {\n const data = _tagged_template_literal([\n \"\\n margin-top: 96px;\\n\\n video {\\n display: block;\\n max-width: 800px;\\n margin: 0 auto;\\n border: solid 1px #eaeae8;\\n }\\n\\n @media (max-width: 1200px) {\\n padding: 0 56px;\\n }\\n @media (max-width: 768px) {\\n padding: 0;\\n margin-top: 48px;\\n }\\n\"\n ]);\n _templateObject4 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport { VideoComponent } from \"@/components/VideoComponent\";\nimport { Button } from \"antd\";\nimport { Container } from \"@/components\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport Image from \"next/image\";\nconst ServiceVideoIntroWrapper = styled.div.withConfig({\n componentId: \"sc-2725be20-0\"\n})(_templateObject(), themeGet(\"text.0\", \"#1B1B29\"));\nconst TitleWrapper = styled.div.withConfig({\n componentId: \"sc-2725be20-1\"\n})(_templateObject1(), themeGet(\"text.0\", \"#1B1B29\"));\nconst ButtonWrapper = styled.div.withConfig({\n componentId: \"sc-2725be20-2\"\n})(_templateObject2());\nconst CTAButton = styled(Button).withConfig({\n componentId: \"sc-2725be20-3\"\n})(_templateObject3(), themeGet(\"primary.1\", \"#00bfc8\"));\nconst VideoWrapper = styled.div.withConfig({\n componentId: \"sc-2725be20-4\"\n})(_templateObject4());\nexport const IntroVideo = (param)=>{\n let {} = param;\n return /*#__PURE__*/ _jsx(ServiceVideoIntroWrapper, {\n children: /*#__PURE__*/ _jsxs(Container, {\n children: [\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"top\",\n children: /*#__PURE__*/ _jsxs(TitleWrapper, {\n children: [\n \"좋은 교재, \",\n /*#__PURE__*/ _jsx(\"br\", {}),\n \"더 잘 쓰이도록\"\n ]\n })\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"desc-box\",\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"desc-item\",\n children: [\n /*#__PURE__*/ _jsx(Image, {\n src: \"/static/assets/img-service-01.svg\",\n alt: \"아이콘\",\n width: 120,\n height: 120\n }),\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"title\",\n children: \"당당하게 이용\"\n }),\n /*#__PURE__*/ _jsxs(\"p\", {\n className: \"desc\",\n children: [\n \"비싸고 복잡했던 라이선싱이 \",\n /*#__PURE__*/ _jsx(\"br\", {}),\n \"플랫폼 거래로 간편해 집니다.\"\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"desc-item\",\n children: [\n /*#__PURE__*/ _jsx(Image, {\n src: \"/static/assets/img-service-02.svg\",\n alt: \"아이콘\",\n width: 120,\n height: 120\n }),\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"title\",\n children: \"편리하게 가공\"\n }),\n /*#__PURE__*/ _jsxs(\"p\", {\n className: \"desc\",\n children: [\n \"교재 중심의 현장 교육에 최적화한 \",\n /*#__PURE__*/ _jsx(\"br\", {}),\n \"콘텐츠 이용툴을 제공합니다.\"\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n className: \"desc-item\",\n children: [\n /*#__PURE__*/ _jsx(Image, {\n src: \"/static/assets/img-service-03.svg\",\n alt: \"아이콘\",\n width: 120,\n height: 120\n }),\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"title\",\n children: \"활발하게 거래\"\n }),\n /*#__PURE__*/ _jsxs(\"p\", {\n className: \"desc\",\n children: [\n \"현장 교육에서 생성되는 \",\n /*#__PURE__*/ _jsx(\"br\", {}),\n \"다양한 교육콘텐츠를 수익화합니다.\"\n ]\n })\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsx(VideoWrapper, {\n children: /*#__PURE__*/ _jsx(VideoComponent, {\n videoSrc: \"/static/videos/230105_solvookCI.mp4\",\n posterSrc: \"/static/assets/video_poster.jpg\"\n })\n })\n ]\n })\n });\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n .ant-collapse {\\n box-sizing: border-box;\\n margin: 0;\\n padding: 0;\\n color: rgba(0, 0, 0, 0.88);\\n font-size: 14px;\\n line-height: 1.5714285714285714;\\n list-style: none;\\n background-color: rgba(0, 0, 0, 0.02);\\n border: none;\\n border-top: solid 1px #00bfc8;\\n border-radius: 0;\\n\\n .ant-collapse-item {\\n border-bottom: 1px solid #00bfc8;\\n box-sizing: border-box;\\n border-radius: 0;\\n\\n &.ant-collapse-item-active {\\n .anticon {\\n transform: rotate(-180deg);\\n }\\n }\\n\\n .ant-collapse-header {\\n background-color: \",\n \";\\n }\\n\\n .ant-collapse-content {\\n &.ant-collapse-content-hidden {\\n display: none;\\n }\\n\\n .ant-collapse-content-box {\\n background: #f5f8fb;\\n }\\n }\\n }\\n }\\n\\n .ant-collapse-header {\\n position: relative;\\n display: flex;\\n flex-wrap: nowrap;\\n align-items: flex-start;\\n padding: 12px 16px;\\n color: rgba(0, 0, 0, 0.88);\\n line-height: 1.5714285714285714;\\n cursor: pointer;\\n transition: all 0.3s, visibility 0s;\\n\\n &.ant-collapse-header-collapsible-only {\\n padding: 12px 28px;\\n background-color: rgba(0, 191, 200, 0.05);\\n\\n .ant-collapse-expand-icon {\\n padding-inline-end: 16px;\\n }\\n\\n @media (max-width: 1200px) {\\n padding: 12px 16px;\\n }\\n @media (max-width: 768px) {\\n padding: 8px 12px;\\n\\n .ant-collapse-expand-icon {\\n padding-inline-end: 8px;\\n }\\n }\\n }\\n\\n .ant-collapse-expand-icon {\\n .anticon {\\n position: relative;\\n width: 24px;\\n height: 24px;\\n transition: transform 0.2s;\\n\\n &:before {\\n display: block;\\n content: '';\\n position: absolute;\\n top: 50%;\\n left: 50%;\\n width: 100%;\\n height: 100%;\\n background: url('/static/assets/icon_folding.svg') no-repeat 50% 50%;\\n background-size: contain;\\n transform: translate(-50%, -50%);\\n }\\n\\n svg {\\n display: none;\\n }\\n }\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n .anticon {\\n width: 16px;\\n height: 16px;\\n }\\n }\\n }\\n\\n .ant-collapse-header-text {\\n font-size: 16px;\\n font-weight: bold;\\n line-height: 1.5;\\n color: \",\n \";\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n font-size: 14px;\\n }\\n }\\n }\\n\\n .ant-collapse-content {\\n background-color: #ffffff;\\n border-top: 1px solid #00bfc8;\\n\\n .ant-collapse-content-box {\\n padding: 25px 40px 32px 64px;\\n\\n p {\\n font-size: 15px;\\n line-height: 1.5;\\n color: \",\n \";\\n margin: 0;\\n }\\n\\n @media (max-width: 1200px) {\\n padding: 25px 40px 32px 56px;\\n }\\n @media (max-width: 768px) {\\n padding: 16px 24px 16px 36px;\\n\\n p {\\n font-size: 14px;\\n }\\n }\\n }\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { Collapse } from \"antd\";\nimport React from \"react\";\nimport styled from \"styled-components\";\nimport { themeGet } from \"@styled-system/theme-get\";\nconst { Panel } = Collapse;\nconst Wrapper = styled.div.withConfig({\n componentId: \"sc-8069b81f-0\"\n})(_templateObject(), themeGet(\"background.2\", \"#F0FAFC\"), themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"text.0\", \"#1B1B29\"));\nexport const IntroFaqs = (param)=>{\n let { faqs } = param;\n return /*#__PURE__*/ _jsx(Wrapper, {\n children: /*#__PURE__*/ _jsx(Collapse, {\n collapsible: \"header\",\n defaultActiveKey: [\n \"1\"\n ],\n children: faqs && faqs.map((faq)=>/*#__PURE__*/ _jsx(Panel, {\n header: faq.title,\n children: /*#__PURE__*/ _jsx(\"div\", {\n children: faq.content\n })\n }, faq.id))\n })\n });\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n background-color: \",\n \";\\n\\n .container {\\n height: 100%;\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n background: #f5f8fb;\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n flex-direction: column;\\n justify-content: center;\\n align-items: \",\n \";\\n height: 100%;\\n line-height: 1.5;\\n background: no-repeat 50% 50% / cover;\\n background-image: \",\n \";\\n background-position: \",\n \";\\n background-size: contain;\\n\\n .panel_inner {\\n height: 100%;\\n text-align: \",\n \";\\n padding-top: 80px;\\n padding-left: \",\n \";\\n\\n p {\\n letter-spacing: -0.25px;\\n }\\n\\n .title {\\n font-size: 48px;\\n font-weight: bold;\\n color: \",\n \";\\n word-break: keep-all;\\n margin: 0;\\n }\\n\\n .desc {\\n font-size: 32px;\\n color: \",\n \";\\n margin-top: 16px;\\n margin-bottom: 0;\\n }\\n\\n img {\\n margin-top: 48px;\\n }\\n\\n @media (max-width: 1200px) {\\n padding-top: 64px;\\n\\n .title {\\n font-size: 36px;\\n }\\n .desc {\\n font-size: 28px;\\n margin-top: 8px;\\n }\\n img {\\n width: 90%;\\n max-width: 500px;\\n }\\n }\\n @media (max-width: 768px) {\\n width: inherit;\\n padding-top: 48px;\\n\\n .title {\\n font-size: 28px;\\n text-shadow: 0 0 5px rgb(255 255 255);\\n\\n br {\\n display: none;\\n }\\n }\\n .desc {\\n font-size: 20px;\\n text-shadow: 0 0 5px rgb(255 255 255);\\n }\\n img {\\n margin-top: 24px;\\n }\\n }\\n }\\n\\n @media (max-width: 1200px) {\\n padding: 0 20px;\\n }\\n @media (max-width: 768px) {\\n padding: 0;\\n }\\n\"\n ]);\n _templateObject2 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject3() {\n const data = _tagged_template_literal([\n \"\\n letter-spacing: -0.25px;\\n padding: 80px 0 150px;\\n\\n .title {\\n font-size: 24px;\\n font-weight: bold;\\n color: \",\n \";\\n margin-bottom: 40px;\\n }\\n\\n @media (max-width: 1200px) {\\n padding-left: 20px;\\n padding-right: 20px;\\n\\n .title {\\n font-size: 20px;\\n margin-bottom: 24px;\\n }\\n }\\n @media (max-width: 768px) {\\n padding: 36px 0 48px;\\n\\n .title {\\n font-size: 16px;\\n margin-bottom: 12px;\\n }\\n }\\n\"\n ]);\n _templateObject3 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport { IntroVideo } from \"./components/IntroVideo\";\nimport { IntroFaqs } from \"./components/IntroFaqs\";\nimport { Container } from \"@/components\";\nimport styled from \"styled-components\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { TextBreak } from \"@/components/TextBreak\";\nimport useNewPlanUI from \"@/lib/utils/newPlan\";\nconst FeatureSectionWrapper = styled.section.withConfig({\n componentId: \"sc-2670ac54-0\"\n})(_templateObject(), (param)=>{\n let { color } = param;\n return color ? color : \"transparent\";\n});\nconst FaqSectionWrapper = styled.section.withConfig({\n componentId: \"sc-2670ac54-1\"\n})(_templateObject1());\nconst SectionTRPanel = styled.div.withConfig({\n componentId: \"sc-2670ac54-2\"\n})(_templateObject2(), (param)=>{\n let { position } = param;\n return position ? \"flex-\" + position : \"center\";\n}, (param)=>{\n let { image } = param;\n return image ? \"url(\" + image + \")\" : \"none\";\n}, (param)=>{\n let { position } = param;\n return position === \"start\" ? \"right center\" : position === \"end\" ? \"left center\" : \"center center\";\n}, (param)=>{\n let { position } = param;\n return position ? \"left\" : \"center\";\n}, (param)=>{\n let { position } = param;\n return position === \"end\" ? \"24px\" : 0;\n}, themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"text.0\", \"#1B1B29\"));\nconst FaqWrapper = styled.div.withConfig({\n componentId: \"sc-2670ac54-3\"\n})(_templateObject3(), themeGet(\"text.0\", \"#1B1B29\"));\nexport const IntroducePage = (param)=>{\n let {} = param;\n // TODO New 요금제 : 사업부에서 추가 내용 수급 필요\n const faqs = useNewPlanUI().useNewPlan ? [\n {\n title: \"쏠북에서는 왜 저작권 문제가 없나요?\",\n id: 1,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n children: [\n \"쏠북은 출판사가 정식으로 출판사의 콘텐츠에 대한 이용 권리를 허가한 국내 유일의 디지털 교재 플랫폼입니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \" 라이선싱 거래는 이용 권리에 대한 거래를 뜻합니다.\"\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n marginTop: \"10px\"\n },\n children: [\n \"쏠북에서 이용권리를 거래하시면, 즉, 수업콘텐츠 라이선스를 계약하시면,\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \" 저작자의 정식 허락 하에 수업 전송, 자료 저작 등 교재에 기반한 다양한 교육활동을 마음껏 할 수 있습니다.\"\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n marginTop: \"10px\"\n },\n children: [\n \"- 저작자의 권리 보호를 위해 수업콘텐츠를 쏠북 플랫폼 뷰어를 통해 제공합니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 다양한 교육활동을 편리하게 할 수 있도록 편집툴, 마켓 등의 기능을 제공합니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 교재의 단순 복제나 전체 인쇄는 저작권자의 허락 범위 내에 있지 않은 경우가 많으니 꼭 참고해주세요.\"\n ]\n })\n ]\n })\n },\n {\n title: \"수업콘텐츠 라이선스 계약 후, 파일로 다운로드할 수 있나요?\",\n id: 3,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n \"수업콘텐츠 라이선스를 계약하신 후, 쏠북 플랫폼 뷰어로 콘텐츠를 확인 및 이용하실 수 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"쏠북은 저작권자의 권리 보호를 위해 쏠북 플랫폼 뷰어를 제공하므로,\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"쏠북에 접속 시 언제든지 어디서나 편리하게 이용할 수 있습니다.\"\n ]\n })\n }\n ] : [\n {\n title: \"쏠북에서는 왜 저작권 문제가 없나요?\",\n id: 1,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n children: [\n \"쏠북은 출판사가 정식으로 출판사의 콘텐츠에 대한 이용 권리를 허가한 국내 유일의 디지털 교재 플랫폼입니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \" 라이선싱 거래는 이용 권리에 대한 거래를 뜻합니다.\"\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n marginTop: \"10px\"\n },\n children: [\n \"쏠북에서 이용권리를 거래하시면, 즉, 수업콘텐츠 라이선스를 계약하시면,\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \" 저작자의 정식 허락 하에 수업 전송, 자료 저작 등 교재에 기반한 다양한 교육활동을 마음껏 할 수 있습니다.\"\n ]\n }),\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n marginTop: \"10px\"\n },\n children: [\n \"- 저작자의 권리 보호를 위해 수업콘텐츠를 쏠북 플랫폼 뷰어를 통해 제공합니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 다양한 교육활동을 편리하게 할 수 있도록 편집툴, 마켓 등의 기능을 제공합니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 교재의 단순 복제나 전체 인쇄는 저작권자의 허락 범위 내에 있지 않은 경우가 많으니 꼭 참고해주세요.\"\n ]\n })\n ]\n })\n },\n {\n title: \"라이트/베이직/프로 라이선스 프로그램은 어떤 차이가 있나요?\",\n id: 2,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n children: [\n \"1. 각 라이선스 프로그램 수업콘텐츠를 이용하는 선생님과 학생 수에 따라 나뉘어 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n margin: \"10px 0\"\n },\n children: [\n \"※ 예를 들어, 선생님께서 [라이트] 수업콘텐츠 라이선스를 계약했다면, \",\n /*#__PURE__*/ _jsx(\"br\", {}),\n \"선생님을 제외한 4명의 학생에게 공유를 하거나, 출력하여 나눠줄 수 있습니다.\"\n ]\n }),\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 라이트 : 선생님과 학생 최대 5명까지 이용할 수 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 베이직 : 선생님과 학생 최대 100명까지 이용할 수 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"- 프로 : 선생님과 학생 최대 500명까지 이용할 수 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {})\n ]\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n style: {\n marginTop: \"10px\"\n },\n children: \"2. 제공되는 수업콘텐츠 라이선스의 내용과 이용 범위는 프로그램 종류와 상관없이 동일합니다.\"\n })\n ]\n })\n },\n {\n title: \"수업콘텐츠 라이선스 계약 후, 파일로 다운로드할 수 있나요?\",\n id: 3,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n \"수업콘텐츠 라이선스를 계약하신 후, 쏠북 플랫폼 뷰어로 콘텐츠를 확인 및 이용하실 수 있습니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"쏠북은 저작권자의 권리 보호를 위해 쏠북 플랫폼 뷰어를 제공하므로,\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"쏠북에 접속 시 언제든지 어디서나 편리하게 이용할 수 있습니다.\"\n ]\n })\n },\n {\n title: \"슬롯이 무엇인가요?\",\n id: 4,\n content: /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n lineHeight: \"1.5\"\n },\n children: [\n \"쏠북은 구매하신 수업콘텐츠 라이선스에 대해 이용할 수 있는 선생님\\xb7학생수 이며, 이용 횟수와는 다릅니다.\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"예를 들어 선생님이 수업콘텐츠를 뷰어로 최초 열었을 때 또는 학생을 등록했을 때 최초 1회씩 슬롯이 차감되며,\",\n /*#__PURE__*/ _jsx(TextBreak, {}),\n \"선생님이 뷰어를 다시 열거나, 이미 등록한 학생을 위한 추가 인쇄를 할 때에는 슬롯이 차감되지 않습니다.\"\n ]\n })\n }\n ];\n return /*#__PURE__*/ _jsxs(_Fragment, {\n children: [\n /*#__PURE__*/ _jsx(IntroVideo, {}),\n /*#__PURE__*/ _jsx(FaqSectionWrapper, {\n children: /*#__PURE__*/ _jsx(Container, {\n children: /*#__PURE__*/ _jsxs(FaqWrapper, {\n children: [\n /*#__PURE__*/ _jsx(\"p\", {\n className: \"title\",\n children: \"자주 묻는 질문\"\n }),\n /*#__PURE__*/ _jsx(IntroFaqs, {\n faqs: faqs\n })\n ]\n })\n })\n })\n ]\n });\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport { IntroducePage } from \"@/modules/landings/introduce/IntroducePage\";\nimport styled from \"styled-components\";\nconst IntroductionPageWrapper = styled.div.withConfig({\n componentId: \"sc-b453280f-0\"\n})(_templateObject());\nconst IntroductionPage = ()=>{\n return /*#__PURE__*/ _jsx(IntroductionPageWrapper, {\n children: /*#__PURE__*/ _jsx(IntroducePage, {})\n });\n};\nexport default IntroductionPage;\n"],"names":[],"sourceRoot":""}