@charset "UTF-8";
/* !_breakpoint.scss */
:root {
  --bp-pcMax: 1360px;
  --bp-spMax: 743px;
}

.remote-support {
  /* !_reset.scss */
  padding-block-end: 8rem;
  overflow-wrap: anywhere;
  font-size: 1.4rem;
  line-height: 1.7142857143;
  word-break: normal;
  line-break: strict;
  /* !_remote-support */
}
.remote-support *, .remote-support *::before, .remote-support *::after {
  box-sizing: border-box;
}
.remote-support p, .remote-support figure, .remote-support blockquote, .remote-support dl, .remote-support dd {
  margin: 0;
}
.remote-support :where(ul[class], ol[class]) {
  list-style: none;
  margin: 0;
  padding: 0;
}
.remote-support img, .remote-support picture, .remote-support video {
  display: block;
  width: 100%;
  max-width: fit-content;
  height: auto;
}
.remote-support small {
  font-size: 1.4rem;
  line-height: 1.7142857143;
}
.remote-support .mod-headingLv2 {
  margin-block: 0 4rem;
  padding-block-end: 1rem;
  border-bottom: solid 1px #d9d9d9;
}
.remote-support .mod-headingLv2 h2 {
  font-size: 2rem;
}
.remote-support .mod-headingLv3 h3 {
  font-size: 1.6rem;
}
.remote-support > section[class^=sec]:first-of-type {
  margin-block-start: 4rem;
}
.remote-support > section[class^=sec]:not(:first-of-type) {
  margin-block-start: 8rem;
}
.remote-support > section[class^=sec] .sec__container {
  padding-inline: 1rem;
}
.remote-support .sec01 .sec01__text {
  margin-block-start: 4rem;
}
.remote-support .sec01 .sec01__image {
  margin-block-start: 3.2rem;
}
.remote-support .sec01 .mod-headingLv3 {
  margin-block: 3.2rem 1.6rem;
}
.remote-support .sec01 .sec01__dest:not(:first-of-type) {
  margin-block-start: 2.4rem;
}
.remote-support .sec01 .sec01__destRow:has(.sec01__destItem) {
  display: grid;
  gap: 0.8rem;
  margin-block-start: 0.8rem;
}
.remote-support .sec01 .sec01__destTitle {
  display: flex;
  column-gap: 0.8rem;
  align-items: center;
  color: #0d2ea0;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.6875;
  letter-spacing: 0.08em;
}
.remote-support .sec01 .sec01__destTitle::before {
  content: "";
  display: block;
  width: 2.6rem;
  height: 2.6rem;
  background-image: url(/-/media/cojp/product/machine/remote-support/img/ico_check.png);
  background-size: cover;
}
.remote-support .sec01 .sec01__destItem {
  display: grid;
  place-content: center;
  padding-block: 2.4rem;
  border-radius: 0.4rem;
  background-color: #f2f2f2;
  font-weight: bold;
  letter-spacing: 0.08em;
}
.remote-support .sec02 .sec02__list {
  display: flex;
  flex-direction: column;
  row-gap: 3.2rem;
}
.remote-support .sec02 .sec02__listDesc {
  display: flex;
  height: calc(2lh + 3.2rem);
  column-gap: 0.8rem;
  align-items: center;
  position: relative;
  padding: 1.6rem;
  border-radius: 0.6rem;
  background-color: #797979;
  color: #fff;
  font-size: 1.4rem;
  line-height: 1.5714285714;
  letter-spacing: 0.06em;
}
.remote-support .sec02 .sec02__listDesc::before {
  content: "";
  display: inline-block;
  width: 4.5rem;
  height: 3.9rem;
  flex-shrink: 0;
  background-image: url(/-/media/cojp/product/machine/remote-support/img/ico_desc.png);
  background-size: cover;
}
.remote-support .sec02 .sec02__listDesc::after {
  content: "";
  width: 2.2rem;
  height: 2.1rem;
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
  position: absolute;
  bottom: -2rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: #797979;
}
.remote-support .sec02 .sec02__listTitle {
  display: flex;
  height: 6.2rem;
  column-gap: 1.6rem;
  align-items: center;
  margin-block-start: 0.4rem;
  background-color: #0d2ea0;
  color: #fff;
  font-weight: bold;
  font-size: 2rem;
  line-height: 1.1;
  letter-spacing: 0.06em;
}
.remote-support .sec02 .sec02__listTitle::before {
  content: attr(data-num);
  display: grid;
  height: 100%;
  aspect-ratio: 1;
  place-content: center;
  background-color: #4863c1;
}
.remote-support .sec02 .sec02__listText {
  margin-block-start: 1.2rem;
}
.remote-support .sec02 .sec02__listImage {
  margin-block-start: 1.2rem;
}
.remote-support .sec02 .sec02__listInner {
  margin-block-start: 1.2rem;
}
.remote-support .sec02 .sec02__listInnerItem {
  margin-inline-start: 0.5em;
  text-indent: -0.5em;
}
.remote-support .sec02 .sec02__listInnerItem::before {
  content: "・";
  margin-inline-start: -0.5em;
}
.remote-support .sec02 .sec02__text {
  position: relative;
  margin-block-start: 4.4rem;
  padding-block-start: 1.6rem;
  color: #0d2ea0;
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 1.6666666667;
  letter-spacing: 0.06em;
  text-align: center;
}
.remote-support .sec02 .sec02__text::before {
  content: "";
  width: 9rem;
  height: 2rem;
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
  position: absolute;
  top: -2rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: currentColor;
}
.remote-support .sec03 .sec03__list {
  margin-block-start: 1.6rem;
}
.remote-support .sec03 .sec03__block {
  margin-block-start: 1.2rem;
  padding: 2rem;
  border: 1px solid #666;
}
.remote-support .sec03 .sec03__blockTitle {
  color: #0d2ea0;
  font-weight: bold;
  font-size: 1.8rem;
  line-height: 1.7222222222;
  letter-spacing: 0.08em;
}
.remote-support .sec03 .sec03__blockText {
  margin-block-start: 1.6rem;
}
.remote-support .sec04 .sec04__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}
.remote-support .sec04 .sec04__listInner {
  display: grid;
  align-items: center;
  margin-block-start: 1.6rem;
  text-align: center;
}
.remote-support .sec04 .sec04__listInner.-col2 {
  grid-template-columns: repeat(2, 1fr);
  column-gap: 1.6rem;
}
.remote-support .sec04 .sec04__listInnerItem {
  line-height: 1.5;
}
.remote-support .sec04 .sec04__listNote,
.remote-support .sec04 .sec04__listNote-02 {
  display: block;
  text-align: center;
}
.remote-support .sec04 .sec04__note {
  display: block;
  margin-block-start: 3.2rem;
}
.remote-support .sec05 .sec05__table {
  width: 100%;
  font-size: 1.4rem;
  line-height: 1.2857142857;
  text-align: center;
}
.remote-support .sec05 .sec05__table th, .remote-support .sec05 .sec05__table td {
  padding-block: 1rem;
}
.remote-support .sec05 .sec05__table th {
  background-color: #cdd4ec;
}
.remote-support .sec05 .sec05__table th:nth-of-type(2) {
  width: 25%;
}
.remote-support .sec05 .sec05__table td {
  background-color: #f2f2f2;
}
.remote-support .sec05 .sec05__table tr > td:not(:last-of-type) {
  padding-inline: 1rem;
}
.remote-support .sec05 .sec05__table tr > td:nth-last-of-type(2) {
  text-align: left;
}
.remote-support .sec05 .sec05__table tr:has(td:nth-of-type(3)) td:first-of-type {
  width: 20%;
}
.remote-support .sec05 .sec05__list {
  padding-block-start: 1.2rem;
}
.remote-support .sec06 .sec06__image:not(:first-of-type) {
  margin-block-start: 2rem;
}
.remote-support .sec06 .sec06__list {
  margin-block-start: 2rem;
}
.remote-support .sec06 .sec06__listItem small {
  font-size: 1.4rem;
  line-height: 1.5714285714;
}
@media (min-width: 744px) {
  .remote-support {
    line-height: 1.2857142857;
    /* !_remote-support */
  }
  .remote-support small {
    line-height: 1.2857142857;
  }
  .remote-support > section[class^=sec] .sec__container {
    padding-inline: 0;
  }
  .remote-support .sec01 .sec01__image {
    max-width: 71.9rem;
    margin-inline: auto;
    margin-block-start: 1.6rem;
  }
  .remote-support .sec01 .sec01__image > img {
    margin-inline: auto;
  }
  .remote-support .sec01 .mod-headingLv3 {
    margin-block: 1.6rem;
  }
  .remote-support .sec01 .sec01__destWrap {
    display: grid;
    grid-template-columns: 2fr 3fr;
    column-gap: min((64 - 16) * (var(--100vw) - 744px) / (1052 - 744) + 16px, 64px);
  }
  .remote-support .sec01 .sec01__dest:not(:first-of-type) {
    margin-block-start: 0;
  }
  .remote-support .sec01 .sec01__destRow:has(.sec01__destItem) {
    grid-auto-flow: column;
    gap: min((8 - 4) * (var(--100vw) - 744px) / (1052 - 744) + 4px, 8px);
  }
  .remote-support .sec01 .sec01__destRow:has(:not(:nth-of-type(3))) {
    grid-template-columns: 1fr 1fr;
  }
  .remote-support .sec01 .sec01__destRow:has(:nth-of-type(3)) {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .remote-support .sec01 .sec01__destItem {
    height: 7.6rem;
    padding-inline: min(8 / 1052 * var(--100vw), 0.8rem);
    font-size: min((14 - 12) * (var(--100vw) - 744px) / (1052 - 744) + 12px, 14px);
    text-align: center;
  }
  .remote-support .sec02 .sec02__list {
    flex-direction: row;
    column-gap: min((24 - 8) * (var(--100vw) - 744px) / (1052 - 744) + 8px, 24px);
  }
  .remote-support .sec02 .sec02__listDesc {
    height: calc(2lh + 1.6rem);
    column-gap: 0.8rem;
    padding-inline: min(8 / 1052 * var(--100vw), 0.8rem) 0;
    padding-block: 0.8rem;
    font-size: clamp(1rem, 14 / 1052 * var(--100vw), 1.4rem);
  }
  .remote-support .sec02 .sec02__listDesc::before {
    width: min(45 / 1052 * var(--100vw), 4.5rem);
    height: min(39 / 1052 * var(--100vw), 3.9rem);
  }
  .remote-support .sec02 .sec02__listDesc::after {
    width: min(22 / 1052 * var(--100vw), 2.2rem);
    height: min(21 / 1052 * var(--100vw), 2.1rem);
    bottom: max(-2rem, -20 / 1052 * var(--100vw));
  }
  .remote-support .sec02 .sec02__listTitle {
    height: min(62 / 1052 * var(--100vw), 6.2rem);
    column-gap: min(16 / 1052 * var(--100vw), 1.6rem);
    font-size: clamp(1rem, 20 / 1052 * var(--100vw), 2rem);
  }
  .remote-support .sec02 .sec02__listText {
    margin-block-start: min(12 / 1052 * var(--100vw), 1.2rem);
    font-size: clamp(1rem, 14 / 1052 * var(--100vw), 1.4rem);
  }
  .remote-support .sec02 .sec02__listImage {
    margin-block-start: min(12 / 1052 * var(--100vw), 1.2rem);
  }
  .remote-support .sec02 .sec02__listInner {
    margin-block-start: min(12 / 1052 * var(--100vw), 1.2rem);
  }
  .remote-support .sec02 .sec02__listInnerItem {
    font-size: clamp(1rem, 14 / 1052 * var(--100vw), 1.4rem);
  }
  .remote-support .sec02 .sec02__text {
    margin-block-start: 4.2rem;
    padding-block-start: 1.8rem;
    font-size: 0;
  }
  .remote-support .sec02 .sec02__text > * {
    font-size: 2rem;
    line-height: 1.6;
  }
  .remote-support .sec02 .sec02__text::before {
    width: 8.6rem;
    height: 1.8rem;
  }
  .remote-support .sec03 .sec03__image {
    margin-block-start: 2.4rem;
  }
  .remote-support .sec03 .sec03__list {
    display: flex;
    flex-wrap: wrap;
    column-gap: min(16 / 1052 * var(--100vw), 1.6rem);
  }
  .remote-support .sec03 .sec03__block {
    margin-block-start: 1.6rem;
    padding-inline: min(24 / 1052 * var(--100vw), 2.4rem);
    padding-block: 2rem;
  }
  .remote-support .sec04 .sec04__list {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-flow: column;
    gap: min((32 - 0) * (var(--100vw) - 744px) / (1052 - 744) + 0px, 32px);
  }
  .remote-support .sec04 .sec04__listInner {
    row-gap: 0.4rem;
  }
  .remote-support .sec04 .sec04__listInner.-col2 {
    grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
    column-gap: min((16 - 4) * (var(--100vw) - 744px) / (1052 - 744) + 4px, 16px);
    white-space: nowrap;
  }
  .remote-support .sec04 .sec04__listNote {
    margin-block-start: 0.4rem;
  }
  .remote-support .sec04 .sec04__listNote-02 {
    margin-block-start: 0.8rem;
  }
  .remote-support .sec04 .sec04__note {
    margin-block-start: 2.4rem;
  }
  .remote-support .sec05 .sec05__table th, .remote-support .sec05 .sec05__table td {
    padding-block: 1.6rem;
  }
  .remote-support .sec05 .sec05__table th {
    font-size: 1.6rem;
    line-height: 1.125;
  }
  .remote-support .sec05 .sec05__table tr > td:not(:last-of-type) {
    padding-inline: 1.6rem;
  }
  .remote-support .sec05 .sec05__list {
    display: flex;
    flex-wrap: wrap;
    column-gap: min(16 / 1052 * var(--100vw), 1.6rem);
    padding-block-start: 1.6rem;
  }
  .remote-support .sec06 .sec06__image:not(:first-of-type) {
    margin-block-start: 0.8rem;
  }
  .remote-support .sec06 .sec06__list {
    margin-block-start: 1.6rem;
  }
  .remote-support .sec06 .sec06__listItem small {
    line-height: 0.7142857143;
  }
}
.main-img {
  margin: 0;
  background-color: #0d2ea0;
  text-align: center;
}

.st-contents {
  padding-inline: 1.6rem;
}

@media (min-width: 390px) and (max-width: 743px), not all and (min-width: 744px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
/* !_common.scss */
:root {
  --1vw: 1vw;
  --50vw: 50vw;
  --100vw: 100vw;
}

html {
  padding-bottom: env(safe-area-inset-bottom);
  font-size: 62.5%;
}
@media (min-width: 390px) and (max-width: 743px), not all and (min-width: 744px) {
  html {
    font-size: calc(10 / 390 * var(--100vw));
  }
}

body {
  font-size: 1.4em;
}

.dsp_ib {
  display: inline-block;
  font: inherit;
}

@media (min-width: 390px) and (max-width: 743px), not all and (min-width: 744px) {
  .dsp_pc {
    display: none !important;
  }
}

@media (min-width: 744px) {
  .dsp_sp {
    display: none !important;
  }
}

.fw-bold {
  font-weight: bold;
}/*# sourceMappingURL=remote-support.css.map */