@charset "UTF-8"; html { box-sizing: border-box; -webkit-text-size-adjust: 100%; word-break: break-word; } *, ::before, ::after { box-sizing: inherit; background-repeat: no-repeat; } ::before, ::after { text-decoration: inherit; vertical-align: inherit; } * { margin: 0; padding: 0; } main { display: block; } a { background-color: transparent; text-decoration: none; } a:active, a:hover { outline-width: 0; } input { border-radius: 0; } [disabled] { cursor: default; } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } [type=search] { outline-offset: -2px; -webkit-appearance: textfield; } [type=search]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: vertical; } button, input, optgroup, select, textarea { font: inherit; } optgroup { font-weight: bold; } button { overflow: visible; } button, select { text-transform: none; } button, [type=button], [type=reset], [type=submit], [role=button] { color: inherit; cursor: pointer; } button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { padding: 0; border-style: none; } button:-moz-focusring, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { outline: 1px dotted ButtonText; } button, html [type=button], [type=reset], [type=submit] { -webkit-appearance: button; } button, input, select, textarea { background-color: transparent; border-style: none; } select { -moz-appearance: none; -webkit-appearance: none; } select::-ms-expand { display: none; } select::-ms-value { color: currentColor; } legend { display: table; max-width: 100%; max-width: 100%; color: inherit; white-space: normal; border: 0; } ::-webkit-file-upload-button { color: inherit; font: inherit; -webkit-appearance: button; } img { border-style: none; } svg:not([fill]) { fill: currentColor; } @media screen { [hidden~=screen] { display: inherit; } [hidden~=screen]:not(:active):not(:focus):not(:target) { position: absolute !important; clip: rect(0 0 0 0) !important; } } [aria-busy=true] { cursor: progress; } [aria-controls] { cursor: pointer; } [aria-disabled] { cursor: default; } ::selection { color: #000; text-shadow: none; background-color: #b3d4fc; } li { list-style: none; } input[type=text] { padding: 0; background: none; border: none; border-radius: 0; outline: none; } input[type=text]:focus { outline: 0; } body { font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif; font-weight: 500; } @media screen and (max-width: 640px) { body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", sans-serif; } } @media all and (-ms-high-contrast: none) { body { font-family: "メイリオ", "Meiryo", sans-serif; } } @media screen and (-ms-high-contrast: none) and (max-width: 640px) { body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", sans-serif; } } img { max-width: 100%; width: auto; } @media screen and (max-width: 640px) { img { width: 100%; } } br { font-size: 0px; } .l-inner { width: 1070px; margin: 0 auto; padding: 0 10px; } @media screen and (max-width: 640px) { .l-inner { width: 90.625vw; } } .pc-obj { display: block !important; } @media screen and (max-width: 640px) { .pc-obj { display: none !important; } } .sp-obj { display: none !important; } @media screen and (max-width: 640px) { .sp-obj { display: block !important; } } .u-bold { font-weight: bold; } .u-yellow { color: #ffe600; } .c-link-btn { width: 780px; margin: 0 auto; background: #ffffff; box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.3); border-radius: 10px; } @media screen and (max-width: 640px) { .c-link-btn { width: 100%; background: none; box-shadow: none; } } .c-link-btn a { transition: all 0.3s; } .c-link-btn a:hover { opacity: 0.6; } @media screen and (max-width: 640px) { .c-link-btn a:hover { opacity: 1; } } @media screen and (max-width: 640px) { .mod-SNSButtons_inner ul li a img, .st_globalLink_country img, .st_globalLink_global a img { width: auto; } } .p-mainvisual { width: 100%; height: 640px; background-color: #ececec; } @media screen and (max-width: 640px) { .p-mainvisual { height: 100vw; } } .p-mainvisual .l-inner { text-align: center; height: 640px; background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/mv-image01_pc"); background-size: 100% 100%; background-position: center center; background-repeat: no-repeat; position: relative; } @media screen and (max-width: 640px) { .p-mainvisual .l-inner { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/mv-image01_sp"); height: 100vw; width: 100%; } } .p-mainvisual .l-inner:before, .p-mainvisual .l-inner:after { content: ""; display: block; width: 435px; height: 640px; background-size: 435px 640px; background-repeat: no-repeat; position: absolute; top: 0; } @media screen and (max-width: 640px) { .p-mainvisual .l-inner:before, .p-mainvisual .l-inner:after { content: none; } } .p-mainvisual .l-inner:before { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/mv-image02_pc"); left: -435px; } .p-mainvisual .l-inner:after { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/mv-image03_pc"); right: -435px; } .p-mainvisual_heading { position: absolute; top: 133px; left: 50%; transform: translateX(-50%); width: 612px; margin: 0; } @media screen and (max-width: 640px) { .p-mainvisual_heading { position: static; transform: none; width: 94.84375vw; margin: 0 auto; padding-top: 21.4vw; padding-right: 0.9vw; } } .p-mainvisual_btn { position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%); width: 800px; background: #ffffff; border-radius: 10px; display: block; box-shadow: 0px 10px 10px 6px rgba(0, 0, 0, 0.3); } @media screen and (max-width: 640px) { .p-mainvisual_btn { position: static; background: none; box-shadow: none; width: 100%; transform: none; width: 93.28125vw; margin: 6.25vw auto; } } .p-intro { background: #fffaef; } .p-intro .l-inner { padding: 80px 10px 83px; position: relative; } @media screen and (max-width: 640px) { .p-intro .l-inner { width: 100%; padding: 9.375vw 0 6.4vw; } } .p-intro_heading { text-align: center; margin-right: 33px; } @media screen and (max-width: 640px) { .p-intro_heading { width: 87.03125vw; margin: 0 auto; } } .p-intro_image { position: absolute; display: block; } .p-intro_image.image01 { top: 215px; left: -36px; } @media screen and (max-width: 640px) { .p-intro_image.image01 { width: 23.75vw; top: 29.6875vw; left: 0; } } .p-intro_image.image02 { top: 215px; right: -47px; } @media screen and (max-width: 640px) { .p-intro_image.image02 { width: 31.875vw; top: 29.6875vw; right: 0; } } .p-intro_document { margin-top: 43px; } @media screen and (max-width: 640px) { .p-intro_document { margin-top: 4vw; } } .p-intro_text { font-size: 20px; line-height: 2; text-align: center; } @media screen and (max-width: 640px) { .p-intro_text { font-size: 5vw; line-height: 1.8; } } .p-intro_text + .p-intro_text { margin-top: 20px; } @media screen and (max-width: 640px) { .p-intro_text + .p-intro_text { margin-top: 3.3vw; } } .p-problem { background-color: #5168b7; } .p-problem .l-inner { padding: 50px 10px 43px; display: flex; justify-content: space-between; position: relative; } @media screen and (max-width: 640px) { .p-problem .l-inner { display: block; padding: 6.6vw 0 8vw; } } .p-problem .l-inner:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 40px 40px 0 40px; border-color: #5168b7 transparent transparent transparent; position: absolute; left: 50%; bottom: -39px; transform: translateX(-50%); } @media screen and (max-width: 640px) { .p-problem .l-inner:after { border-width: 6.25vw 6.25vw 0 6.25vw; bottom: -5.9375vw; } } .p-problem_item { width: 320px; } @media screen and (max-width: 640px) { .p-problem_item { width: 100%; } .p-problem_item + .p-problem_item { margin-top: 4.7vw; } } .p-problem_text { color: #ffffff; font-size: 18px; line-height: 1.6; padding-left: 17px; margin-top: 14px; } @media screen and (max-width: 640px) { .p-problem_text { font-size: 5vw; line-height: 1.5; margin-top: 1.8vw; padding-left: 0; } } .p-solution { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/solution-bg01_pc"); background-repeat: no-repeat; background-position: center center; background-size: 100% auto; } @media screen and (max-width: 1300px) { .p-solution { background-size: auto 100%; } } .p-solution .l-inner { padding: 40px 10px 82px; } @media screen and (max-width: 640px) { .p-solution .l-inner { padding: 6.6vw 0 7.6vw; } } .p-solution_heading { text-align: center; padding-left: 30px; } @media screen and (max-width: 640px) { .p-solution_heading { width: 95.9375vw; padding-left: 0; margin-left: -3.5vw; } } .p-solution_document { margin-top: 33px; display: flex; } @media screen and (max-width: 640px) { .p-solution_document { margin-top: 2.6875vw; display: block; } } .p-solution_textbox { padding-left: 36px; margin-top: -5px; } @media screen and (max-width: 640px) { .p-solution_textbox { margin-top: 4vw; padding-left: 0; } } .p-solution_text { font-size: 20px; line-height: 2; } @media screen and (max-width: 640px) { .p-solution_text { font-size: 5vw; line-height: 1.8; } } .p-solution_text + .p-solution_text { margin-top: 20px; } @media screen and (max-width: 640px) { .p-solution_text + .p-solution_text { margin-top: 3.3vw; } } .p-solution .c-link-btn { margin-top: 46px; } @media screen and (max-width: 640px) { .p-solution .c-link-btn { margin-top: 4.5vw; } } .p-feature { background-color: #fffaef; } .p-feature .l-inner { padding: 50px 10px 80px; } @media screen and (max-width: 640px) { .p-feature .l-inner { padding: 6vw 0 9.375vw; } } .p-feature_heading { text-align: center; padding-right: 60px; position: relative; } @media screen and (max-width: 640px) { .p-feature_heading { width: 95vw; padding-right: 0; margin-left: -2.1vw; } } .p-feature_image { position: absolute; } @media screen and (max-width: 640px) { .p-feature_image { display: none; } } .p-feature_image.image01 { top: 131px; left: 63px; } .p-feature_image.image02 { top: 132px; right: 59px; } .p-feature_text { margin-top: 32px; font-size: 24px; line-height: 1.666; text-align: center; font-weight: bold; } @media screen and (max-width: 640px) { .p-feature_text { margin-top: 4.5vw; font-size: 5vw; text-align: left; line-height: 1.8; } } .p-feature_document { margin-top: 38px; display: flex; justify-content: space-between; } @media screen and (max-width: 640px) { .p-feature_document { margin-top: 3.65vw; display: block; } } .p-feature_list { background-color: #ececec; border: solid 1px #6a6a6a; padding: 24px 30px 23px 48px; border-radius: 0 0 5px 5px; } @media screen and (max-width: 640px) { .p-feature_list { padding: 4.4vw 6.25vw 4.25vw; } } .p-feature_list li { font-size: 20px; padding-left: 30px; position: relative; display: flex; align-items: center; letter-spacing: -0.04em; } @media screen and (max-width: 640px) { .p-feature_list li { font-size: 5vw; padding-left: 9.375vw; } } .p-feature_list li + li { margin-top: 6px; } @media screen and (max-width: 640px) { .p-feature_list li + li { margin-top: 4vw; } } .p-feature_list li:before { content: ""; display: inline-block; width: 26px; height: 21px; background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/feature-icon01"); background-size: 100% 100%; background-repeat: no-repeat; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; } @media screen and (max-width: 640px) { .p-feature_list li:before { width: 8.125vw; height: 6.5625vw; } } .p-feature_unit { width: 505px; } @media screen and (max-width: 640px) { .p-feature_unit { width: 100%; } } .p-feature_unit-heading { background-color: #6a6a6a; color: #ffffff; font-size: 30px; letter-spacing: -0.04em; font-weight: bold; padding: 8px; border-radius: 5px 5px 0 0; text-align: center; } @media screen and (max-width: 640px) { .p-feature_unit-heading { font-size: 5.625vw; padding: 2vw 0 1vw; letter-spacing: 0; } } @media screen and (max-width: 640px) { .p-feature_unit + .p-feature_unit { margin-top: 6.25vw; } } .p-feature_unit.unit02 .p-feature_unit-heading { background-color: #f50554; } .p-feature_unit.unit02 .p-feature_list { background-color: #fff9e9; } .p-feature_unit.unit02 .p-feature_list li { color: #f50554; } .p-feature_unit.unit02 .p-feature_list li:before { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/feature-icon02"); } .l-line-bg { background-color: #ececec; height: 120px; } @media screen and (max-width: 640px) { .l-line-bg { height: 18.75vw; } } .l-line-bg_image { width: 1050px; margin: 0 auto; height: 120px; position: relative; } @media screen and (max-width: 640px) { .l-line-bg_image { width: 100%; height: 18.75vw; } } .l-line-bg_image:before { content: ""; display: block; width: 1980px; height: 120px; background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/bg-image01_pc"); background-size: 1980px 120px; position: absolute; top: 0; left: -465px; } @media screen and (max-width: 640px) { .l-line-bg_image:before { background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/bg-image01_sp"); background-size: 100% 100%; width: 100vw; height: 18.75vw; left: 0; } } .p-case .l-inner { padding: 80px 10px 88px; } @media screen and (max-width: 640px) { .p-case .l-inner { padding: 9.375vw 0 10vw; } } .p-case_heading { text-align: center; } @media screen and (max-width: 640px) { .p-case_heading { width: 96.5625vw; margin-left: -2.7vw; } } .p-case_document { margin: 48px auto 0; display: flex; background-color: #f2f7fd; width: 1005px; } @media screen and (max-width: 640px) { .p-case_document { margin-top: 6.25vw; display: block; width: 100%; padding: 4.6875vw; } } .p-case_document-heading { color: #0d2ea1; font-size: 18px; } @media screen and (max-width: 640px) { .p-case_document-heading { font-size: 4.0625vw; } } .p-case_document-text { font-size: 18px; line-height: 1.56; letter-spacing: -0.05em; } @media screen and (max-width: 640px) { .p-case_document-text { line-height: 1.487; font-size: 4.0625vw; letter-spacing: 0; } } .p-case_image { padding: 15px 0 10px 22px; } @media screen and (max-width: 640px) { .p-case_image { padding: 0; } } .p-case_textbox { padding: 40px 40px 20px 38px; line-height: 1.555; } @media screen and (max-width: 640px) { .p-case_textbox { padding: 3.3vw 0 0; width: 100%; line-height: 1.4615; } } .p-case .c-link-btn { margin-top: 42px; } @media screen and (max-width: 640px) { .p-case .c-link-btn { margin-top: 4.8vw; } } .p-model { background-color: #0d2ea1; } .p-model .l-inner { padding: 64px 10px 80px; } @media screen and (max-width: 640px) { .p-model .l-inner { padding: 8vw 0 9vw; } } .p-model_heading { color: #ffffff; font-size: 38px; text-align: center; letter-spacing: -0.01em; } @media screen and (max-width: 640px) { .p-model_heading { font-size: 6.25vw; line-height: 1.6; letter-spacing: -0.05em; } } .p-model_document { margin-top: 34px; width: 1050px; } @media screen and (max-width: 640px) { .p-model_document { margin-top: 3.25vw; width: 100%; } } .p-model_document-heading { background-color: #4180c2; color: #ffffff; text-align: center; font-weight: bold; border-radius: 3px 3px 0 0; padding: 18px 0 13px 7px; line-height: 1; } @media screen and (max-width: 640px) { .p-model_document-heading { padding: 3.125vw 0; line-height: 1.3; } } .p-model_document-heading .name { font-size: 50px; margin-right: 20px; } @media screen and (max-width: 640px) { .p-model_document-heading .name { font-size: 7.8125vw; margin-right: 0; } } .p-model_document-heading .text { font-size: 30px; } @media screen and (max-width: 640px) { .p-model_document-heading .text { font-size: 5vw; } } .p-model_document-heading .u-small { font-size: 20px; } @media screen and (max-width: 640px) { .p-model_document-heading .u-small { font-size: 4.375vw; } } .p-model_document-content { background-color: #ffffff; border-radius: 0 0 3px 3px; padding: 40px 40px 42px; position: relative; } @media screen and (max-width: 640px) { .p-model_document-content { padding: 0 10px 10px; } } .p-model_image { width: 230px; position: absolute; top: 30px; left: 65px; } @media screen and (max-width: 640px) { .p-model_image { position: static; width: 61.875vw; display: block; margin: 0 auto; padding-top: 2vw; } } .p-model_function { width: 640px; margin: 0 0 0 auto; } @media screen and (max-width: 640px) { .p-model_function { width: 100%; margin-top: 1vw; } } .p-model_function-heading { background-color: #74a2d2; border-radius: 3px 3px 0 0; color: #ffffff; text-align: center; font-size: 20px; font-weight: bold; padding: 7px 0 4px; } @media screen and (max-width: 640px) { .p-model_function-heading { font-size: 4.375vw; padding: 1.35vw 0 0.7vw; } } .p-model_function-list { background-color: #ecf2f9; padding: 20px 20px 16px; display: flex; border-radius: 0 0 3px 3px; } @media screen and (max-width: 640px) { .p-model_function-list { display: block; padding: 3.125vw; } } .p-model_function-list li { width: 200px; } @media screen and (max-width: 640px) { .p-model_function-list li { display: flex; width: 100%; border-top: 1px solid #4180c2; } .p-model_function-list li:last-child { border-bottom: 1px solid #4180c2; } } @media screen and (max-width: 640px) { .p-model_function-image { width: 30.9375vw; } } .p-model_function-text { font-size: 14px; text-align: center; line-height: 1.5; margin-top: 6px; } @media screen and (max-width: 640px) { .p-model_function-text { font-size: 4.0625vw; width: 47.1875vw; text-align: left; display: flex; align-items: center; padding-left: 3.125vw; padding-right: 2vw; } } .p-scene { background-color: #fffbf1; } .p-scene .l-inner { padding: 77px 10px 89px; } @media screen and (max-width: 640px) { .p-scene .l-inner { padding: 9vw 0 8vw; } } .p-scene_heading { text-align: center; } @media screen and (max-width: 640px) { .p-scene_heading { width: 88.75vw; } } .p-scene_list { margin-top: 41px; display: flex; justify-content: space-between; } @media screen and (max-width: 640px) { .p-scene_list { margin-top: 6.25vw; display: block; } } .p-scene_item { width: 323px; } @media screen and (max-width: 640px) { .p-scene_item { width: 100%; } .p-scene_item + .p-scene_item { margin-top: 9.375vw; } } .p-scene_item-heading { margin-top: 12px; font-size: 22px; font-weight: bold; } @media screen and (max-width: 640px) { .p-scene_item-heading { margin-top: 2.5vw; font-size: 5.625vw; } } @media screen and (max-width: 640px) { .p-scene_item-datalist { margin-top: 0.8vw; } } .p-scene_item-data { line-height: 1.5; font-size: 16px; display: flex; } @media screen and (max-width: 640px) { .p-scene_item-data { font-size: 5vw; margin-left: -2vw; } } .p-scene_item-data dt { font-weight: bold; } .p-scene_textbox { background-color: #ffffff; border: solid 1px #f50554; color: #f50554; font-size: 16px; font-weight: bold; line-height: 1.5; margin-top: 18px; padding: 11px 15px; width: 100%; } @media screen and (max-width: 640px) { .p-scene_textbox { font-size: 5vw; margin-top: 3vw; padding: 3.4375vw 1.5vw 3.85vw 4.5vw; } } .p-scene_note { font-size: 12px; line-height: 1.5; margin-top: 13px; } @media screen and (max-width: 640px) { .p-scene_note { margin-top: 3vw; font-size: 3.75vw; } } .p-scene .c-link-btn { margin-top: 23px; } @media screen and (max-width: 640px) { .p-scene .c-link-btn { margin-top: 4.25vw; } } .p-product { background-color: #0d2ea1; } .p-product .l-inner { padding: 70px 10px 85px; } @media screen and (max-width: 640px) { .p-product .l-inner { padding: 7vw 0; } } .p-product_heading { color: #ffffff; font-size: 40px; font-weight: bold; text-align: center; line-height: 1.5; letter-spacing: -0.04em; } @media screen and (max-width: 640px) { .p-product_heading { font-size: 6.25vw; letter-spacing: -0.06em; } } .p-product_heading .u-small { font-size: 30px; } @media screen and (max-width: 640px) { .p-product_heading .u-small { font-size: 5vw; } } .p-product_content { margin-top: 37px; display: flex; justify-content: space-between; } @media screen and (max-width: 640px) { .p-product_content { display: block; margin-top: 4.25vw; } } .p-product_unit { width: 510px; background-color: #ffffff; border-radius: 3px; } @media screen and (max-width: 640px) { .p-product_unit { width: 100%; } } .p-product_unit-heading { border-radius: 3px 3px 0 0; background-color: #4180c2; color: #ffffff; padding: 15px 15px 13px; text-align: center; } @media screen and (max-width: 640px) { .p-product_unit-heading { padding: 1.9vw 0 4vw; } } .p-product_unit-name { font-size: 20px; font-weight: bold; letter-spacing: 0.01em; } @media screen and (max-width: 640px) { .p-product_unit-name { font-size: 4.6875vw; line-height: 2.2; } } .p-product_unit-name .name { font-size: 40px; line-height: 1.1; } @media screen and (max-width: 640px) { .p-product_unit-name .name { font-size: 7.8125vw; } } .p-product_unit-price { font-size: 18px; line-height: 1.5; } @media screen and (max-width: 640px) { .p-product_unit-price { font-size: 4.375vw; line-height: 1; letter-spacing: 0.05em; } } .p-product_unit-price .u-small { font-size: 13px; } @media screen and (max-width: 640px) { .p-product_unit-price .u-small { font-size: 3.4375vw; } } .p-product_unit-content { padding-bottom: 23px; } @media screen and (max-width: 640px) { .p-product_unit-content { padding: 3.125vw 3.125vw 4.6875vw; } } .p-product_unit-image { display: flex; justify-content: center; align-items: center; height: 245px; } @media screen and (max-width: 640px) { .p-product_unit-image { width: 38.4375vw; height: auto; margin: 0 auto; padding-top: 2vw; } } @media screen and (max-width: 640px) { .p-product_unit + .p-product_unit { margin-top: 6.25vw; } } @media screen and (max-width: 640px) { .p-product_unit.unit02 .p-product_unit-content { padding-top: 1.3vw; } } @media screen and (max-width: 640px) { .p-product_unit.unit02 .p-product_unit-image { padding-top: 2vw; width: 44.375vw; } } .p-product_function { width: 470px; margin: 0 auto; background-color: #ecf2f9; } @media screen and (max-width: 640px) { .p-product_function { width: 100%; margin-top: 5vw; } } .p-product_function-title { color: #ffffff; font-size: 20px; font-weight: bold; background-color: #74a2d2; text-align: center; padding: 5px; } @media screen and (max-width: 640px) { .p-product_function-title { font-size: 4.375vw; padding: 1.1vw 0 0.5vw; } } .p-product_function-content { padding: 20px 20px 22px; } @media screen and (max-width: 640px) { .p-product_function-content { padding: 3.125vw 3.125vw 3.125vw; } } .p-product_function-item { display: flex; border-top: solid 1px #74a2d2; } @media screen and (max-width: 640px) { .p-product_function-item { align-items: center; } } .p-product_function-item:last-child { border-bottom: solid 1px #74a2d2; } .p-product_function-image { width: 200px; display: block; } @media screen and (max-width: 640px) { .p-product_function-image { width: 31.5625vw; } } .p-product_function-document { display: flex; align-items: center; width: 230px; } @media screen and (max-width: 640px) { .p-product_function-document { width: 46.5625vw; } } .p-product_function-inner { padding-left: 18px; } @media screen and (max-width: 640px) { .p-product_function-inner { padding-left: 2.5vw; } } .p-product_function-heading { color: #0d2ea1; font-size: 14px; font-weight: bold; } @media screen and (max-width: 640px) { .p-product_function-heading { font-size: 4.0625vw; letter-spacing: -0.02em; } } .p-product_function-text { font-size: 14px; line-height: 1.5; margin-top: 10px; } @media screen and (max-width: 640px) { .p-product_function-text { font-size: 4.0625vw; margin-top: 1.5625vw; } } .p-product_btn { margin-top: 27px; } @media screen and (max-width: 640px) { .p-product_btn { margin-top: 3.6875vw; } } .p-product_btn a { display: block; width: 280px; border: solid 1px #0d2ea1; border-radius: 20px; text-align: center; margin: 0 auto; padding: 6px 0; position: relative; transition: all 0.3s; } @media screen and (max-width: 640px) { .p-product_btn a { width: 75.625vw; border-radius: 11.5625vw; padding: 2vw 0; } } .p-product_btn a:after { content: ""; display: inline-block; width: 22px; height: 22px; background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/icon-arrow"); background-size: 100% 100%; background-repeat: no-repeat; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); } @media screen and (max-width: 640px) { .p-product_btn a:after { width: 6.875vw; height: 6.875vw; right: 3.4375vw; } } .p-product_btn a span { font-size: 16px; text-align: center; } @media screen and (max-width: 640px) { .p-product_btn a span { font-size: 4.375vw; } } .p-product .c-link-btn { margin-top: 46px; } @media screen and (max-width: 640px) { .p-product .c-link-btn { margin-top: 5.25vw; } } .p-relatedlinks .l-inner { padding: 40px 10px 50px; } @media screen and (max-width: 640px) { .p-relatedlinks .l-inner { padding: 4.25vw 0; } } .p-relatedlinks_heading { color: #0d2ea1; font-size: 30px; font-weight: bold; text-align: center; } @media screen and (max-width: 640px) { .p-relatedlinks_heading { font-size: 5.625vw; } } .p-relatedlinks_list { margin-top: 15px; padding: 0 25px; display: flex; justify-content: space-between; } @media screen and (max-width: 640px) { .p-relatedlinks_list { margin-top: 2.6vw; padding: 0; display: block; } } .p-relatedlinks_btn { width: 484px; } @media screen and (max-width: 640px) { .p-relatedlinks_btn { width: 100%; } } .p-relatedlinks_btn a { border: solid 2px #0d2ea1; border-radius: 5px; display: block; padding: 12px 12px 7px; transition: all 0.3s; text-align: center; } @media screen and (max-width: 640px) { .p-relatedlinks_btn a { padding: 1.5625vw 0 3vw; } } .p-relatedlinks_btn-text { font-size: 16px; letter-spacing: -0.04em; } @media screen and (max-width: 640px) { .p-relatedlinks_btn-text { font-size: 3.75vw; } } .p-relatedlinks_btn-heading { color: #0d2ea1; font-size: 25px; font-weight: bold; letter-spacing: -0.06em; line-height: 1.45; } @media screen and (max-width: 640px) { .p-relatedlinks_btn-heading { font-size: 5.625vw; letter-spacing: 0; } } .p-relatedlinks_btn-heading span { position: relative; } @media screen and (max-width: 640px) { .p-relatedlinks_btn-heading span { display: block; } } .p-relatedlinks_btn-heading span:after { content: ""; display: inline-block; width: 29px; height: 29px; background-image: url("/-/media/cojp/product/pro-embroidery/special/lp01/img/icon-arrow"); background-size: 100% 100%; background-repeat: no-repeat; position: absolute; top: 50%; right: -35px; transform: translateY(-50%); } @media screen and (max-width: 640px) { .p-relatedlinks_btn-heading span:after { width: 6.875vw; height: 6.875vw; right: 5.5vw; } } .p-relatedlinks_btn.btn02 a span:after { right: -63px; } @media screen and (max-width: 640px) { .p-relatedlinks_btn.btn02 a span:after { right: 5.5vw; } } @media screen and (max-width: 640px) { .p-relatedlinks_btn + .p-relatedlinks_btn { margin-top: 3.125vw; } }