@charset "UTF-8";
/* ----------------------------------------
.c-contents .c-inner section
---------------------------------------- */
.products + .products {
  margin-top: 8rem;
}
.products .head {
  margin-bottom: 4rem;
  border-left: 5px solid var(--color-main);
  padding-left: 2.5rem;
  font-size: 3rem;
  font-weight: bold;
  line-height: 1.2;
}
/* ----------------------------------------
.c-contents-list
---------------------------------------- */
.c-contents-list {
  grid-template-columns: repeat(3, 1fr);
}
.c-contents-list li:nth-of-type(n + 4) {
  margin-top: -1px;
}
/*.c-contents-list li span {
  position: relative;
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  align-items: center;
  gap: 1.6rem;
  padding-inline: 3rem;
  font-size: 1.8rem;
  font-weight: bold;
  transition: color 0.12s;
}
.c-contents-list li span::before {
  content: "";
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--color-main);
}
.c-contents-list li span::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 {
  position: relative;
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  align-items: center;
  column-gap: 1.6rem;
  padding-inline: 3rem;
  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);
}

.c-contents-list li a.hover {
  z-index: 2;
  box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
}
.c-contents-list li a.hover span {
  color: var(--color-main);
}
.c-contents-list li a.hover figure {
  background-color: #f2f6f8;
}

/* ----------------------------------------
.support-list
---------------------------------------- */
.support-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.2rem;
  margin-top: 12rem;
  background-color: #f2f6f8;
  padding: 3rem;
}
.support-list li a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 8.4rem;
  border: 2px solid #e3e7ea;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: left 2.4rem center;
  padding-inline: 6.9rem 4rem;
  background-size: 2.9rem auto;
  word-break: auto-phrase;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.3;
}
.support-list li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 2.4rem;
  width: 0.6rem;
  aspect-ratio: 1/1;
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
  margin-left: auto;
  transform-origin: right top;
  transform: rotate(45deg);
}
.support-list li a span {
  display: contents;
}
.support-list li:nth-of-type(1) a {
  background-image: url(/images3/common/icon-support-new.png);
}
.support-list li:nth-of-type(2) a {
  background-image: url(/images3/common/icon-support-list.png);
}
.support-list li:nth-of-type(3) a {
  background-image: url(/images3/common/icon-support-movie.png);
}
.support-list li:nth-of-type(4) a {
  background-image: url(/images3/common/icon-support-catalog.png);
}
.support-list li a.hover {
  background-color: #e0ebf6;
  border-color: #e0ebf6;
  color: var(--color-main);
}

/* ----------------------------------------
aside.banner 
---------------------------------------- */
aside.banner {
  width: min(100rem, 100%);
  margin: 5rem 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;
}

/* ----------------------------------------
.c-topics
---------------------------------------- */
/*.c-topics ul {
  grid-template-columns: repeat(auto-fit, 32.2rem);
  justify-content: center;
}*/

/* ----------------------------------------
.c-market
---------------------------------------- */
.c-market {
  margin: 10rem 0 0 0;
}

.c-market-title {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin: 0 0 4rem 0;
}

.c-market-inner {
  display: flex;
  justify-content: center;
  gap: 1.2rem;
  flex-wrap: wrap;
}

.c-market-inner li {
  width: calc((100% - 3.6rem) / 4);
  min-height: 12rem;
  padding: 2rem;
  background-color: #f5f8f7;
}

.c-market-inner li .c-market-subtitle {
  font-size: 1.6rem;
  font-weight: bold;
  color: #50a6e8;
  margin: 0 0 1rem 0;
}

.c-market-inner li p {
  font-size: 1.4rem;
  line-height: 1.714;
}
