@charset "UTF-8";

.page-header {
  background-image: url(/products/images3/title-mv.jpg);
}

/*.other-link a {
  display: grid;
  grid-template-columns: 2.8rem 1fr 0.6rem;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  column-gap: 1.3rem;
  min-width: 29rem;
  width: fit-content;
  height: 5rem;
  border: 1px solid #e9ecee;
  border-radius: calc(infinity * 1px);
  background-color: #fff;
  padding-inline: 3.4rem;
  color: var(--color-main);
  font-size: 1.5rem;
  font-weight: bold;
}
.other-link a::before {
  content: "";
  aspect-ratio: 1;
  background: url(/images3/common/icon-support-list.png) no-repeat center / contain;
}
.other-link a::after {
  content: "";
  aspect-ratio: 1;
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
  transform: rotate(45deg);
}
.other-link a span {
  display: contents;
  font-size: 1.2rem;
}
.other-link a.hover {
  border-color: #e0ebf6;
  background-color: #e0ebf6;
}*/

.other-link-inner{
  display: flex;
  justify-content: flex-end;
  gap:1rem;
}

.other-link-inner a.other-link-newproduct {
  display: grid;
  grid-template-columns: 2.8rem 1fr 0.6rem;
  align-items: center;
  justify-content: center;
  /*margin-left: auto;*/
  column-gap: 1.3rem;
  /*min-width: 29rem;*/
  min-width: 28rem;
  width: fit-content;
  height: 5rem;
  border: 1px solid #5ca7e1;
  border-radius: calc(infinity * 1px);
  background-color: #5ca7e1;
  /*padding-inline: 3.4rem;*/
  padding: 0 3.4rem 0 2rem;
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
}
.other-link-inner a.other-link-newproduct::before {
  content: "";
  aspect-ratio: 1;
  background: url(/images3/common/icon-newproduct.png) no-repeat center / contain;
  width: 3.6rem;
}
.other-link-inner a.other-link-newproduct::after {
  content: "";
  aspect-ratio: 1;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
}

.other-link-inner a.other-link-newproduct.hover {
  color: var(--color-main);
  border-color: #e0ebf6;
  background-color: #e0ebf6;
}
.other-link-inner a.other-link-newproduct.hover::after {
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
}

.other-link-inner a.other-link-selector {
  display: grid;
  grid-template-columns: 2.8rem 1fr 0.6rem;
  align-items: center;
  justify-content: center;
  /*margin-left: auto;*/
  column-gap: 1.3rem;
  /*min-width: 29rem;*/
  min-width: 28rem;
  width: fit-content;
  height: 5rem;
  border: 1px solid #e9ecee;
  border-radius: calc(infinity * 1px);
  background-color: #fff;
  /*padding-inline: 3.4rem;*/
  padding: 0 3.4rem 0 2rem;
  color: var(--color-main);
  font-size: 1.5rem;
  font-weight: bold;
}
.other-link-inner a.other-link-selector::before {
  content: "";
  aspect-ratio: 1;
  background: url(/images3/common/icon-support-selector.png) no-repeat center / contain;
  width: 3rem;
}
.other-link-inner a.other-link-selector::after {
  content: "";
  aspect-ratio: 1;
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
  transform: rotate(45deg);
}
.other-link-inner a.other-link-selector.hover {
  border-color: #e0ebf6;
  background-color: #e0ebf6;
}


.other-link-inner a.other-link-list {
  display: grid;
  grid-template-columns: 2.8rem 1fr 0.6rem;
  align-items: center;
  justify-content: center;
  /*margin-left: auto;*/
  column-gap: 1.3rem;
  /*min-width: 29rem;*/
  min-width: 28rem;
  width: fit-content;
  height: 5rem;
  border: 1px solid #e9ecee;
  border-radius: calc(infinity * 1px);
  background-color: #fff;
  /*padding-inline: 3.4rem;*/
  padding: 0 3.4rem 0 2rem;
  color: var(--color-main);
  font-size: 1.5rem;
  font-weight: bold;
}
.other-link-inner a.other-link-list::before {
  content: "";
  aspect-ratio: 1;
  background: url(/images3/common/icon-support-list.png) no-repeat center / contain;
  width: 3rem;
}
.other-link-inner a.other-link-list::after {
  content: "";
  aspect-ratio: 1;
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
  transform: rotate(45deg);
}
.other-link-inner a.other-link-list span {
  display: contents;
  font-size: 1.2rem;
}
.other-link-inner a.other-link-list.hover {
  border-color: #e0ebf6;
  background-color: #e0ebf6;
}


.c-contents-list {
  grid-template-columns: repeat(3, 1fr);
  margin-top: 3rem;
}
.c-contents-list li:nth-of-type(n + 4) {
  margin-top: -1px;
}
.c-contents-list li .body {
  position: relative;
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  align-items: center;
  column-gap: 1.6rem;
  padding-inline: 3rem 0.5rem;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.3;
  transition: color 0.12s;
}
.c-contents-list li .body::before {
  content: "";
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--color-main);
}
.c-contents-list li .body::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 3.9rem;
  width: 0.6rem;
  aspect-ratio: 1/1;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform-origin: right top;
  transform: rotate(45deg);
}
.c-contents-list li .body span {
  display: block;
  font-size: 1.3rem;
  font-weight: normal;
}
.c-contents-list li a.hover .body p {
  color: var(--color-main);
}

aside.banner {
  width: min(100rem, 100%);
  margin: 11.4rem auto 0;
}
aside.banner a {
  display: block;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.12s, opacity 0.12s;
}
aside.banner a.hover {
  opacity: 0.8;
  box-shadow: initial;
}

/* ----------------------------------------
.description
---------------------------------------- */
.description {
  text-align: center;
  margin: 0 0 6rem 0;
}

.description p {
  font-size: 1.6rem;
  line-height: 1.71;
}
.description strong {
  display: block;
  font-size: 2.4rem;
}
.description strong em {
  font-style: initial;
  font-family: var(--font-noto-serif);
  font-size: 4.8rem;
}


/* ----------------------------------------
.c-topics
---------------------------------------- */
.c-topics ul {
  justify-content: center;
}

.c-topics .description {
  text-align: left;
  margin: 0;
}