@charset "UTF-8";
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.otf) format("opentype"); }

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.otf) format("opentype"); }

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.otf) format("opentype"); }

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.otf) format("opentype"); }

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
Windowsdows版 / Mac版
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
@media screen and (min-width: 768px) {
  .mouseSetting .main-block {
    padding-bottom: 80px; } }

@media screen and (max-width: 767px) {
  .mouseSetting .main-block {
    padding-bottom: 64px; } }

.mouseSetting__title01 {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  color: #000;
  text-align: center; }
  @media screen and (min-width: 768px) {
    .mouseSetting__title01 {
      font-size: 32px;
      font-size: 3.2rem; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__title01 {
      font-size: 20px;
      font-size: 2rem; } }
  @media screen and (min-width: 768px) {
    .mouseSetting__title01 + .mouseSetting__title02,
    .mouseSetting__title01 + .install__list {
      margin-top: 64px; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__title01 + .mouseSetting__title02,
    .mouseSetting__title01 + .install__list {
      margin-top: 22px; } }
  .mouseSetting__title01.-underLine {
    border-bottom: 3px solid #0fbedf; }
    @media screen and (min-width: 768px) {
      .mouseSetting__title01.-underLine {
        padding-bottom: 16px; } }

.mouseSetting__title02 {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  background-color: #0fbedf;
  padding: 4px 0;
  color: #fff;
  text-align: center; }
  @media screen and (min-width: 768px) {
    .mouseSetting__title02 {
      font-size: 20px;
      font-size: 2rem; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__title02 {
      font-size: 14px;
      font-size: 1.4rem; } }

.mouseSetting__title03 {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  color: #0fbedf;
  text-align: center; }
  @media screen and (min-width: 768px) {
    .mouseSetting__title03 {
      font-size: 20px;
      font-size: 2rem;
      margin-top: 48px; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__title03 {
      font-size: 16px;
      font-size: 1.6rem;
      margin-top: 19px; } }
  @media screen and (min-width: 768px) {
    .mouseSetting__title03 + * {
      margin-top: 18px; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__title03 + * {
      margin-top: 11px; } }

@media screen and (min-width: 768px) {
  .mouseSetting__section {
    margin-top: 64px; } }

@media screen and (max-width: 767px) {
  .mouseSetting__section {
    margin-top: 40px; } }

.mouseSetting__section .box01__inner {
  background-color: #f6f6f6; }
  @media screen and (min-width: 768px) {
    .mouseSetting__section .box01__inner {
      display: flex;
      justify-content: space-between;
      padding: 24px; } }
  @media screen and (max-width: 767px) {
    .mouseSetting__section .box01__inner {
      padding: 16px; } }

@media screen and (min-width: 768px) {
  .mouseSetting__section .box01__textArea {
    width: 483px; } }

@media screen and (min-width: 768px) {
  .mouseSetting__section .box01__imgArea {
    width: 240px; } }

@media screen and (max-width: 767px) {
  .mouseSetting__section .box01__imgArea {
    margin-top: 10px; }
    .mouseSetting__section .box01__imgArea img {
      width: 100%; } }

@media screen and (min-width: 768px) {
  .box01__list {
    margin-top: 10px; } }

@media screen and (max-width: 767px) {
  .box01__list {
    margin-top: 5px; } }

.box01__listAnnotation {
  position: relative; }
  .box01__listAnnotation::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0; }
  @media screen and (min-width: 768px) {
    .box01__listAnnotation {
      font-size: 14px;
      font-size: 1.4rem;
      padding-left: 16px; } }
  @media screen and (max-width: 767px) {
    .box01__listAnnotation {
      font-size: 10px;
      font-size: 1rem;
      padding-left: 12px; } }

.imgArea {
  width: 100%; }
  .imgArea img {
    display: block;
    margin-right: auto;
    margin-left: auto; }

@media screen and (min-width: 768px) {
  .tableSection {
    display: flex;
    justify-content: space-between; } }

@media screen and (min-width: 768px) {
  .tableButtonSet {
    width: 48.5%; } }

@media screen and (max-width: 767px) {
  .tableButtonSet {
    width: 100%; } }

@media screen and (min-width: 768px) {
  .tableButtonSet th, .tableButtonSet td {
    padding: 12px; } }

@media screen and (max-width: 767px) {
  .tableButtonSet th, .tableButtonSet td {
    padding: 8px; } }

.tableButtonSet thead .cellBgGray {
  background-color: #f6f6f6;
  border: 1px solid #ccc; }

.tableButtonSet tbody th, .tableButtonSet tbody td {
  border: 1px solid #0fbedf; }

.tableButtonSet tbody .cellBgLightBlue {
  background-color: #e7f8fc; }
  @media screen and (min-width: 768px) {
    .tableButtonSet tbody .cellBgLightBlue {
      width: 120px; } }

.tableButtonSet tbody .cellBgBlue {
  background-color: #0fbedf;
  color: #fff; }

@media screen and (min-width: 768px) {
  .tableButtonSet tbody .cellImage {
    padding: 16px;
    text-align: center; }
    .tableButtonSet tbody .cellImage img {
      width: auto;
      height: auto; } }

@media screen and (max-width: 767px) {
  .tableButtonSet tbody .cellImage {
    padding: 12px;
    text-align: center; } }

@media screen and (min-width: 768px) {
  .tableButtonSet tbody figcaption {
    margin-top: 10px; } }

@media screen and (max-width: 767px) {
  .tableButtonSet tbody figcaption {
    margin-top: 5px; } }

.install__list {
  counter-reset: num;
  list-style-type: none !important; }

.install__listItem {
  position: relative;
  padding-left: 40px;
  border-bottom: 1px dotted #ccc;
  color: #000; }
  @media screen and (min-width: 768px) {
    .install__listItem {
      padding-bottom: 32px; } }
  @media screen and (max-width: 767px) {
    .install__listItem {
      padding-bottom: 15px; } }
  .install__listItem::before {
    counter-increment: num;
    content: counter(num) ".";
    font-weight: bold;
    position: absolute;
    left: 0;
    font-size: 20px; }
    @media screen and (min-width: 768px) {
      .install__listItem::before {
        font-size: 20px;
        top: -5px; } }
    @media screen and (max-width: 767px) {
      .install__listItem::before {
        font-size: 16px;
        top: -4px; } }
  @media screen and (min-width: 768px) {
    .install__listItem + .install__listItem {
      margin-top: 32px; } }
  @media screen and (max-width: 767px) {
    .install__listItem + .install__listItem {
      margin-top: 15px; } }
  @media screen and (min-width: 768px) {
    .install__listItem > .imgArea {
      margin-top: 20px; } }
  @media screen and (max-width: 767px) {
    .install__listItem > .imgArea {
      margin-top: 10px; } }
  @media screen and (min-width: 768px) {
    .install__listItem > .imgArea img {
      max-width: 560px; } }
  @media screen and (min-width: 768px) {
    .install__listItem > .imgArea.-col2 {
      width: 560px;
      margin-right: auto;
      margin-left: auto;
      display: flex;
      justify-content: space-between; }
      .install__listItem > .imgArea.-col2 img {
        width: 276px; } }
  @media screen and (max-width: 767px) {
    .install__listItem > .imgArea.-col2 img + img {
      margin-top: 8px; } }

.-textRed {
  color: #fe1417; }

@media screen and (min-width: 768px) {
  .download {
    display: flex;
    justify-content: space-between; } }

@media screen and (min-width: 768px) {
  .download .download__button {
    margin-left: auto;
    margin-right: auto;
    width: 49%; } }

@media screen and (max-width: 767px) {
  .download .download__button {
    width: 100%; }
    .download .download__button + .download__button {
      margin-top: 8px; } }

.download .download__button a {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  -webkit-transition: all ease 0.25s;
  transition: all ease 0.25s;
  display: block;
  color: #fff;
  background-color: #e55c79;
  border: 1px solid #e55c79;
  text-decoration: none;
  text-align: center;
  border-radius: 110px;
  line-height: 1.4; }
  @media screen and (min-width: 768px) {
    .download .download__button a {
      font-size: 20px;
      font-size: 2rem;
      padding: 16px 0; } }
  @media screen and (max-width: 767px) {
    .download .download__button a {
      font-size: 16px;
      font-size: 1.6rem;
      padding: 8px 0; } }
  .download .download__button a:hover {
    border: 1px solid #e55c79;
    background-color: #fff;
    color: #e55c79; }

.transition.-Index {
  padding: 0;
  margin-top: 0; }

@media screen and (min-width: 768px) {
  .transition {
    display: flex;
    justify-content: space-between;
    margin-top: 64px;
    padding: 0 64px; } }

@media screen and (max-width: 767px) {
  .transition {
    margin-top: 40px; } }

@media screen and (min-width: 768px) {
  .transition .transition__button {
    width: 49%; } }

@media screen and (max-width: 767px) {
  .transition .transition__button {
    width: 100%; }
    .transition .transition__button + .transition__button {
      margin-top: 8px; } }

.transition .transition__button a {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  -webkit-transition: all ease 0.25s;
  transition: all ease 0.25s;
  display: block;
  color: #fff;
  text-decoration: none;
  text-align: center;
  line-height: 1.4;
  position: relative; }
  @media screen and (min-width: 768px) {
    .transition .transition__button a {
      font-size: 20px;
      font-size: 2rem;
      padding: 16px 0; } }
  @media screen and (max-width: 767px) {
    .transition .transition__button a {
      font-size: 16px;
      font-size: 1.6rem;
      padding: 8px 0; } }

.transition .transition__button.-Index {
  width: 32%; }

.transition .transition__button.-blue a {
  background-color: #0fbedf;
  border: 1px solid #0fbedf; }
  .transition .transition__button.-blue a:hover {
    border: 1px solid #0fbedf;
    background-color: #fff;
    color: #0fbedf; }

.transition .transition__button.-green a {
  background-color: #92c708;
  border: 1px solid #92c708; }
  .transition .transition__button.-green a:hover {
    border: 1px solid #92c708;
    background-color: #fff;
    color: #92c708; }

.transition .transition__button .arrow {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  right: 8px;
  background-color: #fff;
  border-radius: 50%;
  transform: translateY(-50%); }
  @media screen and (min-width: 768px) {
    .transition .transition__button .arrow {
      width: 32px;
      height: 32px; }
      .transition .transition__button .arrow img {
        width: 20px; } }
  @media screen and (max-width: 767px) {
    .transition .transition__button .arrow {
      width: 24px;
      height: 24px; }
      .transition .transition__button .arrow img {
        width: 16px; } }

@media screen and (min-width: 768px) {
  .check__text {
    margin-top: 64px; } }

@media screen and (max-width: 767px) {
  .check__text {
    margin-top: 30px; } }

.check__text dt {
  color: #000;
  font-size: 16px;
  font-size: 1.6rem; }

@media screen and (min-width: 768px) {
  .check__text dd {
    margin-top: 10px; } }

@media screen and (max-width: 767px) {
  .check__text dd {
    margin-top: 5px; } }

.decimal-list .annotation {
  display: block;
  position: relative; }
  .decimal-list .annotation::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0; }
  @media screen and (min-width: 768px) {
    .decimal-list .annotation {
      font-size: 14px;
      font-size: 1.4rem;
      padding-left: 16px; } }
  @media screen and (max-width: 767px) {
    .decimal-list .annotation {
      font-size: 10px;
      font-size: 1rem;
      padding-left: 12px; } }

@media screen and (min-width: 768px) {
  .cation {
    margin-top: 72px; } }

@media screen and (max-width: 767px) {
  .cation {
    margin-top: 54px; } }

.type {
  text-align: center;
  border: 15px solid #dbf5fa;
  padding: 20px; }
  .type .-textbule {
    color: #0fbedf;
    font-weight: bold; }
  .type .-textRed {
    font-size: 80%; }
  @media screen and (min-width: 768px) {
    .type {
      font-size: 18px;
      font-size: 1.8rem; } }
  @media screen and (max-width: 767px) {
    .type {
      font-size: 16px;
      font-size: 1.6rem; } }

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
対応製品一覧
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
@media screen and (min-width: 768px) {
  .compatibleProduct {
    margin-top: 64px; } }

@media screen and (max-width: 767px) {
  .compatibleProduct {
    margin-top: 40px; } }

.compatibleProduct__sectionTitle01 {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  color: #000;
  text-align: center; }
  @media screen and (min-width: 768px) {
    .compatibleProduct__sectionTitle01 {
      font-size: 28px;
      font-size: 2.8rem; } }
  @media screen and (max-width: 767px) {
    .compatibleProduct__sectionTitle01 {
      font-size: 20px;
      font-size: 2rem; } }

.compatibleProduct__sectionTitle02 {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 400;
  color: #000;
  border-bottom: 2px solid #92c708; }
  @media screen and (min-width: 768px) {
    .compatibleProduct__sectionTitle02 {
      font-size: 24px;
      font-size: 2.4rem;
      margin-top: 53px;
      padding-bottom: 8px; } }
  @media screen and (max-width: 767px) {
    .compatibleProduct__sectionTitle02 {
      font-size: 16px;
      font-size: 1.6rem;
      margin-top: 23px;
      padding-bottom: 4px; } }

.compatibleProduct__anchor {
  display: flex;
  justify-content: center; }
  @media screen and (min-width: 768px) {
    .compatibleProduct__anchor {
      margin-top: 28px; } }
  @media screen and (max-width: 767px) {
    .compatibleProduct__anchor {
      margin-top: 23px; } }
  @media screen and (min-width: 768px) {
    .compatibleProduct__anchor .compatibleProduct__anchorButton {
      width: calc((100% - 48px)/3); }
      .compatibleProduct__anchor .compatibleProduct__anchorButton:not(:first-child) {
        margin-left: 24px; } }
  @media screen and (max-width: 767px) {
    .compatibleProduct__anchor .compatibleProduct__anchorButton {
      display: flex;
      width: calc((100% - 4px)/3); }
      .compatibleProduct__anchor .compatibleProduct__anchorButton:not(:first-child) {
        margin-left: 4px; } }
  .compatibleProduct__anchor .compatibleProduct__anchorButton a {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 100;
    -webkit-transition: all ease 0.25s;
    transition: all ease 0.25s;
    display: block;
    color: #fff;
    text-decoration: none;
    line-height: 1.4;
    position: relative; }
    @media screen and (min-width: 768px) {
      .compatibleProduct__anchor .compatibleProduct__anchorButton a {
        font-size: 16px;
        font-size: 1.6rem;
        padding: 16px 0;
        text-align: center; } }
    @media screen and (max-width: 767px) {
      .compatibleProduct__anchor .compatibleProduct__anchorButton a {
        display: flex;
        align-items: center;
        width: 100%;
        font-size: 11px;
        font-size: 1.1rem;
        padding: 8px; } }
  .compatibleProduct__anchor .compatibleProduct__anchorButton.-green a {
    background-color: #92c708;
    border: 1px solid #92c708; }
    .compatibleProduct__anchor .compatibleProduct__anchorButton.-green a:hover {
      border: 1px solid #92c708;
      background-color: #fff;
      color: #92c708; }
  .compatibleProduct__anchor .compatibleProduct__anchorButton .arrow {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    background-color: #fff;
    border-radius: 50%;
    transform: translateY(-50%) rotate(90deg); }
    @media screen and (min-width: 768px) {
      .compatibleProduct__anchor .compatibleProduct__anchorButton .arrow {
        right: 8px;
        width: 32px;
        height: 32px; }
        .compatibleProduct__anchor .compatibleProduct__anchorButton .arrow img {
          width: 20px; } }
    @media screen and (max-width: 767px) {
      .compatibleProduct__anchor .compatibleProduct__anchorButton .arrow {
        right: 3px;
        width: 18px;
        height: 18px; }
        .compatibleProduct__anchor .compatibleProduct__anchorButton .arrow img {
          width: 10px; } }

.compatibleProduct__mouseList {
  display: flex;
  flex-wrap: wrap; }
  @media screen and (min-width: 768px) {
    .compatibleProduct__mouseList {
      margin-top: 30px; } }
  @media screen and (max-width: 767px) {
    .compatibleProduct__mouseList {
      justify-content: space-between;
      margin-top: 23px; } }

@media screen and (min-width: 768px) {
  .compatibleProduct__mouseItem {
    width: 150px;
    padding: 0 24px; }
    .compatibleProduct__mouseItem:nth-child(n + 5) {
      margin-top: 40px; } }

@media screen and (max-width: 767px) {
  .compatibleProduct__mouseItem {
    width: 38%;
    padding: 0 16px; }
    .compatibleProduct__mouseItem:nth-child(n + 3) {
      margin-top: 16px; } }

.compatibleProduct__mouseItem a {
  display: block;
  color: #000;
  text-decoration: none; }

@media screen and (min-width: 768px) {
  .compatibleProduct__mouseImage {
    padding: 0 8px; } }

@media screen and (max-width: 767px) {
  .compatibleProduct__mouseImage {
    padding: 0 4px; } }

.compatibleProduct__mouseProductName p {
  margin-bottom: 0;
  line-height: 1.4; }

.compatibleProduct__mouseProductNameSmall {
  color: #777;
  font-size: 10px;
  font-size: 1rem; }

@media screen and (min-width: 768px) {
  a .compatibleProduct__mouseProductNameLarge {
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold; } }

@media screen and (max-width: 767px) {
  a .compatibleProduct__mouseProductNameLarge {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold; } }

a:hover {
  color: #0fbedf; }

span.supText {
  font-size: 70%;
  vertical-align: top;
  position: relative;
  top: -0.1em; }

/*nav-anchor-wrap調整*/
.nav-anchor-wrap {
  margin: 0; }
  .nav-anchor-wrap .nav-anchor {
    margin-bottom: 50px; }
    .nav-anchor-wrap .nav-anchor li {
      margin-right: 30px; }

/*Digio2 製品関連ソフトウェア・ドライバダウンロード調整*/
#dl-main-wide .dl_band_ttl {
  font-size: 16px;
  font-size: 1.6rem;
  color: #fff;
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
  padding: 6px 24px 8px;
  background: #92c708;
  line-height: 1.4; }

#dl-main-wide .dl_col2 {
  display: inline-block;
  width: 47%;
  vertical-align: top; }
  #dl-main-wide .dl_col2:last-child {
    margin-left: 5%; }

#dl-main-wide .tbl-cmn th, #dl-main-wide .tbl-cmn td {
  padding: 10px;
  font-size: 14px;
  font-size: 1.4rem; }

#dl-main-wide .tbl-cmn th {
  width: 33%; }

#dl-main-wide .btn-l-wrap {
  text-align: center; }
  #dl-main-wide .btn-l-wrap a {
    width: 90%;
    margin: 0 auto;
    padding: 6px 0; }

#dl-main-wide .btn-l span {
  font-size: 16px;
  font-size: 1.6rem; }

@media screen and (max-width: 767px) {
  #dl-main-wide .dl_band_ttl {
    font-size: 14px;
    font-size: 1.4rem; }
  #dl-main-wide .dl_col2 {
    display: block;
    width: 100%; }
    #dl-main-wide .dl_col2:last-child {
      margin-left: 0;
      margin-top: 80px; }
  #dl-main-wide .tbl-cmn th, #dl-main-wide .tbl-cmn td {
    padding: 10px;
    font-size: 12px;
    font-size: 1.2rem; }
  #dl-main-wide .tbl-cmn th {
    width: 100%; }
  #dl-main-wide .btn-l span {
    font-size: 14px;
    font-size: 1.4rem; } }
