@charset "UTF-8";
/* ========================================
トップページ
/index.html
======================================== */
/* Layout
------------------------------ */
.pg-top.l-main::before {
  content: none;
}
@media (max-width: 767px) {
  .pg-top.l-main {
    padding-bottom: 5rem;
  }
}
@media (max-width: 767px) {
  .pg-top__fv {
    display: flex;
    flex-direction: column-reverse;
  }
}

/* mv-slider
------------------------------ */
.mv-slider {
  position: relative;
}
.mv-slider__item {
  display: block !important;
}
@media (hover: hover) {
  .mv-slider__item a img {
    transition: opacity 0.2s ease;
  }
  .mv-slider__item a:hover img {
    opacity: 0.8;
  }
}
.mv-slider .slick-dots {
  position: absolute;
  bottom: min(2rem, 1.0416666667vw);
  left: 0;
  width: 50%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}
.mv-slider .slick-dots li button {
  display: block;
  width: 3rem;
  height: 0;
  padding-top: 0.5rem;
  background-color: #BEBEBE;
  overflow: hidden;
}
@media (hover: hover) {
  .mv-slider .slick-dots li button:hover {
    background-color: #999;
  }
}
.mv-slider .slick-dots li.slick-active button {
  background-color: var(--color-primary);
}
@media (max-width: 767px) {
  .mv-slider .slick-dots {
    bottom: 1rem;
    width: 100%;
  }
}

/* top-news
------------------------------ */
.top-news {
  padding: 0.6rem;
  background-color: #2361BE;
  display: grid;
  grid-template-columns: 13.2rem 1fr;
  gap: 3rem;
  line-height: 1.6;
  color: #FFF;
}
.top-news__header {
  border-right: solid 1px currentColor;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 400;
}
.top-news__body {
  overflow: hidden;
}
.top-news__item {
  height: 6.8rem;
  display: flex !important;
  align-items: center;
  font-size: 1.8rem;
}
@media (hover: hover) {
  .top-news__item a:hover {
    text-decoration: underline;
  }
}
@media (max-width: 767px) {
  .top-news {
    --top-news-height: 5rem;
    grid-template-columns: 7.2rem 1fr;
    gap: 1rem;
  }
  .top-news__header {
    font-size: 1.3rem;
  }
  .top-news__item {
    height: 5.8rem;
    font-size: 1.3rem;
  }
  .top-news__text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .top-news__text br {
    display: none;
  }
}

/* top-course
------------------------------ */
.top-course {
  padding-top: 9rem;
}
@media (max-width: 767px) {
  .top-course {
    padding-top: 5.6rem;
  }
}
.top-course__title {
  margin-bottom: 8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  text-align: center;
  font-size: min(3.5rem, 5.6vw);
  color: var(--color-primary);
}
.top-course__title::before, .top-course__title::after {
  content: "";
  width: 2.5rem;
  border-top: solid 0.2rem currentColor;
}
@media (max-width: 767px) {
  .top-course__title {
    margin-bottom: 3rem;
    font-size: 2.1rem;
  }
}
.top-course__notes {
  margin-bottom: 2rem;
  text-align: right;
}
@media (max-width: 767px) {
  .top-course__notes {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.1rem;
  }
}
.top-course .course-table th, .top-course .course-table td {
  border-color: #F2F2F2;
}
.top-course .course-table tbody tr:nth-child(odd) {
  background-color: #FFF;
}
.top-course .course-table tbody tr:nth-child(even) {
  background-color: #F2F9FC;
}
@media (max-width: 767px) {
  .top-course .course-table tbody tr {
    display: flex;
    flex-direction: column;
  }
  .top-course .course-table td {
    padding: 1rem 0;
  }
  .top-course .course-table .col-date {
    order: 1;
    padding-bottom: 0;
    border-bottom: none;
  }
  .top-course .course-table .col-title {
    order: 2;
  }
  .top-course .course-table .col-deadline {
    order: 3;
    padding-top: 1rem;
    padding-bottom: 0;
    border-top: solid 1px #D5E3FF;
  }
  .top-course .course-table .col-icon {
    display: none;
  }
}

/* top-search
------------------------------ */
.top-search {
  margin-bottom: 3rem;
  padding: 3rem 3.75% 4rem;
  border-top: solid 0.5rem var(--color-primary);
  background-color: #FFF;
}
@media (max-width: 767px) {
  .top-search {
    padding: 1.5rem 3.75% 2rem;
    border-top-width: 0.3rem;
  }
}
.top-search__title {
  margin-bottom: 2.5rem;
  font-size: 2.1rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .top-search__title {
    margin-bottom: 1rem;
    font-size: 1.5rem;
  }
}
.top-search__check {
  border-top: solid 1px #E4E4E4;
  display: grid;
  grid-template-columns: 10.5rem 1fr;
}
.top-search__check dt {
  padding: 1.5rem 0;
  border-bottom: solid 1px #E4E4E4;
  font-weight: 700;
  color: #656565;
}
.top-search__check dd {
  position: relative;
  padding: 1.5rem 0 1.5rem 3rem;
  border-bottom: solid 1px #E4E4E4;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 3rem;
}
.top-search__check dd::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0;
  height: calc(100% - 2rem);
  border-left: solid 1px #E4E4E4;
}
@media (max-width: 767px) {
  .top-search__check {
    grid-template-columns: 1fr;
  }
  .top-search__check dt {
    padding: 1rem 0 0.5rem;
    border-bottom: none;
    font-size: 1.3rem;
  }
  .top-search__check dd {
    padding: 0 0 1rem;
    flex-direction: column;
    gap: 0.5rem;
  }
  .top-search__check dd::before {
    content: none;
  }
}
.top-search__block {
  border: none;
  border-top: solid 1px #E4E4E4;
  display: grid;
  grid-template-columns: 10.5rem 1fr;
}
.top-search__block legend {
  display: contents;
}
.top-search__block legend p {
  padding: 1.5rem 0;
  font-weight: 700;
  color: #656565;
}
.top-search__block > div {
  position: relative;
  padding: 1.5rem 0 1.5rem 3rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 3rem;
}
.top-search__block > div::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0;
  height: calc(100% - 2rem);
  border-left: solid 1px #E4E4E4;
}
@media (max-width: 767px) {
  .top-search__block {
    grid-template-columns: 1fr;
  }
  .top-search__block legend p {
    padding: 1rem 0 0.5rem;
    font-size: 1.3rem;
  }
  .top-search__block > div {
    padding: 0 0 1rem;
  }
  .top-search__block > div::before {
    content: none;
  }
}
.top-search__keyword {
  padding-top: 2.5rem;
  border-top: solid 1px #E4E4E4;
  display: grid;
  grid-template-columns: 10.5rem 1fr;
  align-items: center;
}
.top-search__keyword dt {
  font-weight: 700;
  color: #656565;
}
.top-search__keyword dd {
  position: relative;
  padding-left: 3rem;
}
.top-search__keyword dd::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  right: 1.5rem;
  transform: translateY(-50%);
  width: 2.7rem;
  aspect-ratio: 1/1;
  background: url(/education/assets/images/common/search-icon.svg) center center/contain no-repeat;
}
@media (max-width: 767px) {
  .top-search__keyword {
    padding-top: 1rem;
    grid-template-columns: 1fr;
  }
  .top-search__keyword dt {
    font-size: 1.3rem;
  }
  .top-search__keyword dd {
    margin-top: 1rem;
    padding: 0;
  }
  .top-search__keyword dd::after {
    width: 2rem;
  }
}
.top-search input[type=checkbox] {
  margin-right: 0.5rem;
}
.top-search input[type=text] {
  width: 100%;
  padding: 1rem 5rem 1rem 1rem;
  border: solid 1px #ACACAC;
  border-radius: 0.6rem;
}
@media (max-width: 767px) {
  .top-search input[type=text] {
    padding: 0.5rem 4rem 0.5rem 0.5rem;
  }
}

/* modal
------------------------------ */
.modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: block;
  pointer-events: none;
}
.modal__overlay, .modal__dialog {
  opacity: 0;
  transition: opacity 0.2s ease;
}
.modal.is-open {
  pointer-events: auto;
}
.modal.is-open .modal__overlay, .modal.is-open .modal__dialog {
  opacity: 1;
}
.modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}
.modal__dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(98rem, 92vw);
  max-height: 85vh;
  background: #fff;
  overflow: auto;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}
.modal__close {
  position: sticky;
  top: 0;
  display: flex;
  z-index: 2;
}
.modal__close-btn {
  margin-left: auto;
  width: 4.8rem;
  aspect-ratio: 1;
  border: none;
  background: #111;
  color: #fff;
  font-size: 2.8rem;
  line-height: 1;
  cursor: pointer;
}
@media (max-width: 767px) {
  .modal__close-btn {
    width: 4rem;
    font-size: 2.2rem;
  }
}
.modal__content {
  margin-top: -4.8rem;
  padding: 3rem 5rem 4rem;
}
@media (max-width: 767px) {
  .modal__content {
    padding: 5%;
  }
}

html.is-modal-open {
  overflow: hidden;
}
html.is-modal-open body {
  overflow: hidden;
}

/* icon-guide
------------------------------ */
.icon-guide {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto;
  gap: 0 4rem;
  grid-template-areas: "title title" "box01 box02" "box03 box03";
}
@media (max-width: 767px) {
  .icon-guide {
    display: block;
  }
}
.icon-guide__title {
  grid-area: title;
  margin-bottom: 1rem;
  font-size: 2.5rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .icon-guide__title {
    font-size: 1.8rem;
  }
}
.icon-guide__box01 {
  grid-area: box01;
}
.icon-guide__box02 {
  grid-area: box02;
}
.icon-guide__box03 {
  grid-area: box03;
}
.icon-guide__box {
  margin-top: 2rem;
}
.icon-guide__subttl {
  margin-bottom: 2rem;
  font-size: 1.8rem;
  font-weight: 400;
}
.icon-guide__subttl::after {
  content: "";
  display: block;
  height: 0.3rem;
  margin-top: 1rem;
  border: solid 1px currentColor;
}
@media (max-width: 767px) {
  .icon-guide__subttl {
    font-size: 1.5rem;
  }
}
.icon-guide__list {
  display: grid;
  grid-template-columns: 10.5rem 1fr;
  gap: 1rem;
}
.icon-guide__list.icon-list--blue {
  --icon-bg: #DEE4F0;
}
.icon-guide__list.icon-list--gray {
  --icon-bg: #E8E8E8;
}
.icon-guide__list dt {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.icon-guide__list dt::after {
  content: "";
  width: 1.5rem;
  height: 0;
  margin-top: 1rem;
  border-top: solid 1px currentColor;
}
.icon-guide__list dt span {
  width: 8rem;
  min-height: 2em;
  border-radius: 0.4rem;
  background-color: var(--icon-bg);
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-primary);
}
.icon-guide__list dt figure {
  width: 16rem;
}
.icon-guide__list dt figure img {
  width: 100%;
}
.icon-guide__list dd {
  font-size: 1.3rem;
}
.icon-guide__list--lg {
  grid-template-columns: 19rem 1fr;
  align-items: center;
}
.icon-guide__list--lg dt {
  align-items: center;
}
.icon-guide__list--lg dt::after {
  margin-top: 0;
}
@media (max-width: 767px) {
  .icon-guide__list dd {
    font-size: 1.2rem;
  }
  .icon-guide__list--lg {
    display: block;
  }
  .icon-guide__list--lg dt {
    width: clamp(8rem, 30%, 12rem);
    margin-bottom: 1rem;
  }
  .icon-guide__list--lg dt::after {
    content: none;
  }
}

/* ========================================
ラックセキュリティアカデミーについて
/about/index.html
======================================== */
/* ラックセキュリティアカデミーとは
------------------------------ */
.about-overview {
  display: flex;
  grid-template-columns: 1fr 31.8rem;
  gap: 7.0281124498%;
  line-height: var(--lh-text);
}
.about-overview__text {
  flex: 1;
}
.about-overview__image {
  width: 31.8rem;
}
@media (max-width: 767px) {
  .about-overview {
    flex-direction: column-reverse;
    gap: 2rem;
  }
  .about-overview__image {
    width: 70%;
    margin-inline: auto;
    text-align: center;
  }
}

/* ラックが⼈材教育を⾏う理由
------------------------------ */
.about-reason__list {
  margin-top: 3rem;
  padding: 3rem;
  background-color: #F2F2F2;
  line-height: var(--lh-text);
}
.about-reason__list dt {
  position: relative;
  padding-left: 2.8rem;
  font-size: 1.7rem;
  font-weight: 700;
}
.about-reason__list dt::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 2rem;
  aspect-ratio: 1;
  border: solid 0.5rem #5696CC;
  border-radius: 50%;
}
.about-reason__list dd {
  margin-top: 1rem;
  padding-left: 2.8rem;
}
.about-reason__list dd:not(:last-child) {
  margin-bottom: 2rem;
}
@media (max-width: 767px) {
  .about-reason__list {
    padding: 2rem 1.5rem;
  }
  .about-reason__list dt {
    font-size: 1.5rem;
  }
}
.about-reason__image {
  margin-top: 7rem;
}
.about-reason__caption {
  margin-top: 2rem;
  gap: 3.6rem;
}
.about-reason__caption-item {
  padding: 1.5rem 2rem;
  border-radius: 1rem;
  background-color: #F2F2F2;
}
.about-reason__caption-item:not(:last-child) {
  margin-bottom: 1rem;
}
.about-reason__caption-item p {
  position: relative;
  margin-bottom: 1rem;
  padding-left: 3rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #1F56A6;
}
.about-reason__caption-item p span {
  position: absolute;
  top: 0.2rem;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.3rem;
  height: 2.3rem;
  padding-bottom: 0.2rem;
  border-radius: 50%;
  background-color: #1F56A6;
  line-height: 2.3rem;
  font-weight: 500;
  color: #FFF;
}
.about-reason__caption-item ul {
  margin-left: 1rem;
}
.about-reason__caption-item ul li {
  margin-top: 0.5rem;
  position: relative;
  padding-left: 2rem;
}
.about-reason__caption-item ul li::before {
  content: "・";
  position: absolute;
  left: 0;
  color: #92A5C1;
}
@media (max-width: 767px) {
  .about-reason__caption {
    gap: 1rem;
  }
  .about-reason__caption-item {
    padding: 1rem 1rem;
  }
  .about-reason__caption-item p {
    font-size: 1.5rem;
  }
  .about-reason__caption-item ul {
    font-size: 1.3rem;
  }
}

/* ラックセキュリティアカデミーの強みと3つの特長
------------------------------ */
.about-feature__image {
  width: min(100%, 66rem);
  margin: 5rem auto 0;
}
@media (max-width: 767px) {
  .about-feature__image {
    margin-top: 3rem;
  }
}

.about-point {
  margin-top: 8.4rem;
}
@media (max-width: 767px) {
  .about-point {
    margin-top: 3rem;
  }
}
.about-point__head {
  position: relative;
  margin-bottom: 3rem;
  padding-bottom: 0.7rem;
  background-color: var(--color-primary);
  display: flex;
  justify-content: center;
  align-items: baseline;
  line-height: 1.2;
  font-size: 3.5rem;
  color: #FFF;
}
.about-point__head::after {
  content: "";
  position: absolute;
  bottom: -1.2rem;
  left: calc(50% - 1.1rem);
  width: 2.2rem;
  aspect-ratio: 22/12;
  background-color: var(--color-primary);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.about-point__head em {
  font-size: 5rem;
}
.about-point__head span {
  font-size: 2.5rem;
}
@media (max-width: 767px) {
  .about-point__head {
    margin-bottom: 2rem;
    font-size: 2rem;
  }
  .about-point__head::after {
    bottom: -0.8rem;
  }
  .about-point__head em {
    font-size: 3rem;
  }
  .about-point__head span {
    font-size: 1.5rem;
  }
}
.about-point__item {
  margin-top: 1.5rem;
  padding: 2rem 3rem 3rem;
  background-color: #EFEFEF;
}
@media (max-width: 767px) {
  .about-point__item {
    margin-top: 1rem;
    padding: 1.5rem 1.5rem 2rem;
  }
}
.about-point__title {
  margin-bottom: 2rem;
  display: flex;
  align-items: baseline;
  gap: 0 2rem;
  line-height: 1.4;
  font-size: 2.1rem;
  color: var(--color-primary);
}
.about-point__title em {
  margin-left: 0.5rem;
  font-family: "Oswald", sans-serif;
  font-size: 4.5rem;
  font-weight: 500;
  line-height: 1;
}
@media (max-width: 767px) {
  .about-point__title {
    margin-bottom: 1rem;
    flex-direction: column;
    font-size: 1.8rem;
  }
  .about-point__title span {
    margin-bottom: 0.5rem;
    font-size: 1.3rem;
  }
  .about-point__title em {
    font-size: 2.4rem;
  }
}
.about-point__2col {
  display: flex;
  align-items: flex-start;
  gap: 2.4rem;
}
@media (max-width: 767px) {
  .about-point__2col {
    flex-direction: column;
  }
}
.about-point__text {
  flex: 1;
}
.about-point__text p {
  line-height: var(--lh-text);
}
.about-point__text p:not(:last-child) {
  margin-bottom: 1rem;
}
.about-point__image {
  width: 24rem;
  padding: 3rem 2rem;
  background-color: #FFF;
}
.about-point__image figcaption {
  margin-top: 2.5rem;
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .about-point__image {
    margin: 0 auto;
  }
}

/* ========================================
はじめて受講される方
/training/index.html
======================================== */
/* 研修について
------------------------------ */
.training-about {
  margin-top: 5rem;
}
@media (max-width: 767px) {
  .training-about {
    margin-top: 3rem;
  }
}

/* 対象者別・役割別セキュリティ研修プラン
------------------------------ */
.plan {
  margin-top: 5rem;
}
@media (max-width: 767px) {
  .plan {
    margin-top: 3rem;
  }
}
.plan__block {
  margin-block-end: 3rem;
  background-color: #F4F4F4;
}
.plan__head {
  padding: 2rem 2.5rem 2rem 3rem;
  border-top: solid 0.3rem var(--color-primary);
  display: flex;
  align-items: center;
  gap: 1rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
@media (hover: hover) {
  .plan__head:hover {
    background-color: rgba(4, 34, 117, 0.1);
  }
}
.plan__head-title {
  flex: 1;
  font-size: 2.1rem;
  color: var(--color-primary);
}
.plan__head-icon {
  --icon-width: 2rem;
  position: relative;
  width: var(--icon-width);
  aspect-ratio: 20/3;
  background-color: currentColor;
}
.plan__head-icon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: var(--icon-width);
  aspect-ratio: 20/3;
  transform: rotate(90deg);
  background-color: currentColor;
}
.is-open .plan__head-icon::after {
  transform: rotate(0);
}
@media (max-width: 767px) {
  .plan__head {
    padding: 3%;
  }
  .plan__head-title {
    font-size: 1.6rem;
  }
  .plan__head-icon {
    --icon-width: 1.4rem;
  }
}
.plan__body {
  display: none;
  padding: min(5%, 3rem) min(5%, 4.8rem) min(5%, 4.5rem);
  border-top: solid 1px var(--color-primary);
}
.plan__outline {
  line-height: 1.86;
}
.plan__feature {
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.2rem;
}
.plan__feature dl {
  padding: 5% 6% 6%;
  background-color: #FFF;
  line-height: 1.4;
}
.plan__feature dl dt {
  margin-bottom: 1rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-primary);
}
.plan__feature dl dd {
  margin-top: 0.5rem;
  position: relative;
  padding-left: 1.5em;
}
.plan__feature dl dd::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  width: 0.9em;
  aspect-ratio: 1;
  border: solid 0.26em var(--color-primary-subtle);
  border-radius: 50%;
}
@media (max-width: 767px) {
  .plan__feature {
    grid-template-columns: 1fr;
  }
  .plan__feature dl dt {
    font-size: 1.5rem;
  }
  .plan__feature dl dd {
    font-size: 1.3rem;
  }
}
.plan__course {
  margin-top: 5rem;
}
.plan__course-head {
  margin-bottom: 2.5rem;
  display: flex;
  align-items: center;
  gap: 2rem;
}
.plan__course-title {
  font-size: 1.8rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .plan__course {
    margin-top: 3rem;
  }
  .plan__course-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 1.3rem;
  }
}
.plan .course-list {
  --col-cat: 11rem;
  --col-arrow: 2rem;
  --meta-col-gap: 2rem;
}
.plan .course-list__item:nth-child(odd) {
  background-color: #FFF;
}
.plan .course-list__item:nth-child(even) {
  background-color: #F2F9FC;
}
.plan .course-list__item a {
  display: grid;
  grid-template-columns: var(--col-cat) 1fr var(--col-arrow);
  grid-template-rows: auto auto;
  grid-template-areas: "a b c" "a d c";
}
.plan .course-list__item a .course-row__cat {
  grid-area: a;
}
.plan .course-list__item a .course-row__title {
  grid-area: b;
}
.plan .course-list__item a .course-row__meta {
  grid-area: d;
  padding: 0 1rem 1rem;
  flex-direction: row;
  justify-content: flex-start;
  gap: var(--meta-col-gap);
}
.plan .course-list__item a .course-row__meta dl dd {
  flex-direction: row;
}
.plan .course-list__item a .course-row__meta dl dd > span:not(:last-child) {
  margin-right: 1rem;
}
.plan .course-list__item a .course-row__arrow {
  grid-area: c;
}
@media (max-width: 767px) {
  .plan .course-list {
    --col-arrow: 1.5rem;
    --meta-col-gap: 1rem;
  }
  .plan .course-list__item a {
    grid-template-columns: 1fr var(--col-arrow);
    grid-template-rows: auto auto auto;
    grid-template-areas: "a a" "b c" "d c";
  }
  .plan .course-list__item a .course-row__meta {
    padding: 0 0 1.5rem 1rem;
  }
  .plan .course-list__item a .course-row__meta dl dd {
    flex-direction: column;
  }
  .plan .course-list__item a .course-row__meta dl dd > span:not(:last-child) {
    margin-right: 0;
  }
}

/* コース情報の見方
------------------------------ */
.course-guide {
  width: min(100%, 75rem);
  margin-inline: auto;
  line-height: 1.86;
}
.course-guide__caption > li {
  position: relative;
  margin-top: 3rem;
  padding-left: 2.6rem;
}
.course-guide__caption-num {
  position: absolute;
  top: -0.5rem;
  left: 0;
  font-size: 2rem;
  color: #FF0023;
}
.course-guide__caption dl {
  margin: 2rem 0 0 3rem;
  display: grid;
  grid-template-columns: 9rem 1fr;
  gap: 2rem 1rem;
}
@media (max-width: 767px) {
  .course-guide__caption {
    margin-top: 3rem;
  }
  .course-guide__caption > li {
    margin-top: 1.5rem;
    font-size: 1.3rem;
  }
  .course-guide__caption dl {
    margin-left: 0;
    gap: 1rem 0.5rem;
  }
}

/* ========================================
オープン開催（対面集合 / リモートライブ）| はじめて受講される方
/training/open/index.html
======================================== */
/* オープン開催の特長
------------------------------ */
.open-feature {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: 9rem 1fr;
  gap: 1.5rem;
}
.open-feature__head {
  border-right: solid 0.2rem var(--color-primary-subtle);
  font-weight: 700;
  color: var(--color-primary);
}
.open-feature__head span {
  display: inline-block;
  vertical-align: middle;
  margin: -1rem 0 0 0.2em;
  font-family: "Oswald", sans-serif;
  font-size: 4rem;
}
.open-feature__title {
  font-size: 2.5rem;
  color: var(--color-primary);
}
.open-feature__list li {
  margin-top: 1rem;
  position: relative;
  padding-left: 2rem;
}
.open-feature__list li::before {
  content: "・";
  position: absolute;
  left: 0;
}
@media (max-width: 767px) {
  .open-feature {
    grid-template-columns: 7rem 1fr;
  }
  .open-feature__head {
    padding-top: 1rem;
    border-right-width: 1px;
  }
  .open-feature__head span {
    font-size: 2.4rem;
  }
  .open-feature__title {
    font-size: 1.8rem;
  }
  .open-feature__list li {
    padding-left: 1em;
  }
}

/* 開催形態
------------------------------ */
.delivery-format {
  margin-top: 5rem;
}
.delivery-format__card {
  grid-template-rows: auto 1fr auto;
}
.delivery-format__body {
  margin-top: -1rem;
  font-size: 1.5rem;
}
.delivery-format__image {
  width: 94%;
  margin-inline: auto;
  padding: 5% 10% 0;
  border-radius: 1rem;
  background-color: #E2EAF7;
}
.delivery-format__notes {
  margin-top: 3rem;
}
.delivery-format__private {
  margin-top: 3rem;
  padding: 3rem 3rem 4rem;
  background-color: #F4F4F4;
}
.delivery-format__private dt {
  margin-bottom: 1rem;
  font-size: 2.1rem;
  font-weight: 700;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .delivery-format {
    margin-top: 3rem;
  }
  .delivery-format__notes {
    margin-top: 2rem;
  }
  .delivery-format__private {
    padding: 2rem 2rem 2.5rem;
  }
  .delivery-format__private dt {
    font-size: 1.5rem;
  }
}

/* 受講形態
------------------------------ */
.attendance-type__card {
  grid-template-rows: auto auto auto;
}
.attendance-type__body {
  font-size: 1.5rem;
}

/* 学習形態
------------------------------ */
.learning-style {
  display: grid;
  grid-template-columns: 9rem 1fr;
  gap: 2rem 1rem;
}

/* オープン開催コース一覧
------------------------------ */
.open-course__search {
  border-radius: 9999px;
  background-color: #E2EAF7;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
}
.open-course__search label {
  display: block;
  padding: 2.5rem 0;
  background-color: #E2EAF7;
  text-align: center;
  color: var(--color-primary);
  cursor: pointer;
}
.open-course__search label:not(:first-of-type) {
  border-left: solid 1px #FFF;
}
.open-course__search input {
  display: none;
}
.open-course__search input:checked + label {
  border-left-color: #E2EAF7;
  border-radius: 9999px;
  background-color: var(--color-primary);
  color: #FFF;
}
.open-course__search input:checked + label + input + label {
  border-left-color: #E2EAF7;
}
.open-course__search input:not(:checked):hover + label {
  text-decoration: underline;
}
@media (max-width: 767px) {
  .open-course__search {
    border-radius: 1rem;
    background-color: transparent;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(2, 1fr);
    gap: 1px;
    overflow: hidden;
    font-size: 1.3rem;
  }
  .open-course__search label {
    padding: 1rem;
    border: none;
    background-color: #E2EAF7;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .open-course__search input:checked + label {
    border-radius: 0;
  }
}

/* ========================================
オープン開催のお申込みについて | オープン開催（対面集合 / リモートライブ）| はじめて受講される方
/education/training/open/flow.html
======================================== */
/* お申込みの流れ
------------------------------ */
.apply-flow {
  --icon-width: 2.4rem;
  --icon-height: 2.2rem;
  --space: 2rem;
}
@media (max-width: 767px) {
  .apply-flow {
    --icon-width: 1.8rem;
    --icon-height: 1.4rem;
    --space: 1.5rem;
  }
}
.apply-flow__item {
  position: relative;
  margin-top: calc(var(--icon-height) + 2rem);
  padding: var(--space);
  border: solid 1px #B5B5B5;
  border-radius: 1.5rem;
  display: grid;
  grid-template-columns: 13rem 1fr;
  gap: var(--space);
}
.apply-flow__item::after {
  content: "";
  position: absolute;
  bottom: calc((var(--icon-height) + 1rem) * -1);
  left: calc(50% - var(--icon-width) / 2);
  width: var(--icon-width);
  height: var(--icon-height);
  background-color: #C2DBF3;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
@media (max-width: 767px) {
  .apply-flow__item {
    grid-template-columns: auto;
  }
}
.apply-flow--last-open {
  margin-top: calc(var(--icon-height) + 2rem);
  padding: var(--space);
  border-radius: 1.5rem;
  border-color: #C2DBF3;
  background-color: #C2DBF3;
  text-align: center;
  font-size: 2.1rem;
  font-weight: 700;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .apply-flow--last-open * {
    font-size: 1.8rem;
  }
}
.apply-flow--last-online {
  border-color: #C2DBF3;
  background-color: #C2DBF3;
}
.apply-flow--last-online::after {
  content: none;
}
.apply-flow__title {
  border-right: solid 0.2rem var(--color-primary-subtle);
  font-size: 2.1rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .apply-flow__title {
    padding-bottom: 1rem;
    border-right: none;
    border-bottom: solid 1px var(--color-primary-subtle);
    font-size: 1.8rem;
  }
}
.apply-flow__body p + p {
  margin-top: 1rem;
}
.apply-flow__body a {
  color: var(--color-text-link);
}
@media (hover: hover) {
  .apply-flow__body a:hover {
    text-decoration: underline;
  }
}
.apply-flow__subttl {
  margin-bottom: 0.5rem;
  color: var(--color-primary);
}
.apply-flow__subttl:not(:first-child) {
  margin-top: 1.5rem;
}

/* 後払いによるお支払（企業様のみ）
------------------------------ */
.apply-payment {
  margin-top: 8rem;
}
.apply-payment__flow li {
  position: relative;
  margin-top: 1rem;
  padding: 0.8rem 1.5rem;
  border: solid 1px #B5B5B5;
  border-radius: 1rem;
  display: flex;
  align-items: stretch;
  gap: 2rem;
  color: var(--color-primary);
}
.apply-payment__flow li:not(:last-child)::after {
  content: "";
  position: absolute;
  bottom: -1rem;
  left: calc(50% - 1.2rem);
  width: 2.4rem;
  height: 0.7rem;
  background-color: #00ABE3;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.apply-payment__flow li span {
  font-size: 1.3rem;
}
.apply-payment__flow-item--bg {
  background-color: #E2EAF7;
}
.apply-payment__flow-ttl {
  width: 12rem;
  border-right: solid 1px var(--color-primary);
  font-weight: 700;
}
.apply-payment__flow-body {
  flex: 1;
}
.apply-payment__flow-notes {
  margin-top: 1rem;
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .apply-payment__flow li {
    gap: 1.5rem;
  }
  .apply-payment__flow-ttl {
    width: 11rem;
  }
}

/* キャンセルポリシー
------------------------------ */
.apply-cancel {
  font-size: 1.3rem;
}
.apply-cancel p {
  display: inline;
  line-height: normal;
}
.apply-cancel .thead th,
.apply-cancel thead th {
  padding: 0.5rem 1rem;
  border: solid 1px #989898;
  background-color: #E2EAF7;
  font-weight: 700;
}
.apply-cancel .thead th strong,
.apply-cancel thead th strong {
  font-weight: 700;
  color: #E8072A;
}
.apply-cancel tbody :not(.thead) th {
  width: 28%;
  padding: 1rem;
  border: solid 1px #989898;
  background-color: #E2EAF7;
  font-size: 1.8rem;
  font-weight: 400;
}
.apply-cancel tbody :not(.thead) th sup {
  font-size: 1.1rem;
}
.apply-cancel tbody :not(.thead) td {
  width: 18%;
  padding: 1rem;
  border: solid 1px #989898;
  text-align: center;
}
.apply-cancel tbody :not(.thead) td:last-child {
  text-align: left;
}
@media (max-width: 767px) {
  .apply-cancel {
    min-width: 80rem;
    margin-right: 4vw;
  }
  .apply-cancel tbody :not(.thead) th {
    width: 16%;
    padding: 0.5rem 1rem;
    font-size: 1.3rem;
  }
  .apply-cancel tbody :not(.thead) td {
    width: 21%;
    padding: 0.5rem 1rem;
  }
  .apply-cancel tbody :not(.thead) td:last-child {
    font-size: 1.2rem;
  }
}

/* ========================================
情報処理安全確保支援士（登録セキスペ）特定講習 | オープン開催（対面集合 / リモートライブ）| はじめて受講される方
/education/training/open/news_ipa.html
======================================== */
.ipa-courses__lists {
  display: flex;
  gap: 5rem;
}
.ipa-courses__lists > ul {
  flex: 1;
  margin: 0 !important;
}
.ipa-courses__lists > ul li {
  margin-top: 1rem;
}
@media (max-width: 767px) {
  .ipa-courses__lists {
    display: block;
  }
}

.ipa-flow__item:last-child::after {
  content: none;
}
.ipa-flow__body {
  display: flex;
  gap: 3rem;
}
.ipa-flow__text {
  width: 35%;
}
.ipa-flow__image {
  flex: 1;
}
@media (max-width: 767px) {
  .ipa-flow__body {
    display: block;
  }
  .ipa-flow__text {
    width: 100%;
    margin-bottom: 2rem;
  }
}

.ipa-criteria__subttl {
  margin: 3rem 0 2rem;
  font-size: 1.8rem;
  color: var(--color-primary);
}

/* ========================================
修了証について | オープン開催（対面集合 / リモートライブ） | はじめて受講される方
/training/open/openbadge.html
======================================== */
/* 共有カラム
------------------------------ */
.openbadge-2col {
  margin-top: 2rem;
  display: flex;
  align-items: flex-start;
  gap: 3.6rem;
}
.openbadge-2col__text {
  flex: 1;
  margin-bottom: 3rem;
}
.openbadge-2col__image {
  width: 25.1004016064%;
  text-align: center;
}
@media (max-width: 767px) {
  .openbadge-2col {
    margin-top: 3rem;
    flex-direction: column;
    gap: 2rem;
  }
  .openbadge-2col__text {
    margin-bottom: 0;
  }
  .openbadge-2col__image {
    width: 100%;
  }
}

.openbadge-step {
  display: grid;
  grid-template-columns: 5.2rem 1fr;
  gap: 2rem;
}
.openbadge-step__number {
  padding-right: 1rem;
  border-right: solid 0.2rem #ADB9D6;
  line-height: 1;
  text-align: center;
  font-family: "Oswald", sans-serif;
  color: var(--color-primary);
}
.openbadge-step__number span {
  display: block;
  font-size: 3.5rem;
}
@media (max-width: 767px) {
  .openbadge-step {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .openbadge-step__number {
    padding: 0 0 0.5rem 0;
    border-right: none;
    border-bottom: solid 1px #ADB9D6;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
  }
  .openbadge-step__number span {
    margin-top: -1rem;
    font-size: 3rem;
  }
}

/* オープンバッジとは
------------------------------ */
.openbadge-overview img {
  display: block;
  max-width: 60vw;
  margin: 0 auto;
}

/* オープンバッジのアカウント登録
------------------------------ */
.account-step__image {
  width: 40.1606425703%;
  text-align: center;
}
@media (max-width: 767px) {
  .account-step__image {
    width: 100%;
  }
}

/* オープンバッジ受領者サクセス・ストーリー2024
------------------------------ */
.success-story {
  padding: 2.5rem;
  background-color: #F4F4F4;
}
.success-story__title {
  margin-bottom: 1rem;
  color: var(--color-primary);
}

/* ========================================
eラーニング学習管理サービス | eラーニング／コンテンツレンタル | はじめて受講される方
/training/online/online_option.html
======================================== */
/* 学習管理サービスの内容
------------------------------ */
.elearning-table {
  width: 100%;
}
.elearning-table th, .elearning-table td {
  padding: 1.5rem 2rem;
  border: solid #A7A7A7;
  border-width: 1px 0;
  vertical-align: top;
  text-align: left;
}
.elearning-table th {
  min-width: 24rem;
  padding-inline: 1.5rem;
  border-left: solid 0.5rem #5C709D;
  background-color: #F4F4F4;
  font-weight: 400;
}
@media (max-width: 767px) {
  .elearning-table {
    font-size: 1.3rem;
  }
  .elearning-table th, .elearning-table td {
    padding: 1rem;
  }
  .elearning-table th {
    min-width: 7rem;
  }
}

/* ========================================
コース詳細
/course/_format.html
======================================== */
/* コース概要
------------------------------ */
.course-outline {
  position: sticky;
  top: calc(var(--header-height) + 2rem);
  float: right;
  width: 24.1666666667%;
  margin: -12.7rem 2rem 2rem 0;
  border: solid 1px #FFF;
  background-color: #FFF;
  box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.16);
}
.course-outline__header {
  position: relative;
  min-height: calc(12.7rem - 1px);
  padding: 1rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.5rem;
  line-height: 1.44;
  color: #FFF;
}
.course-outline__header--fundamentals {
  background-color: var(--color-category-fundamentals);
}
.course-outline__header--monitoring {
  background-color: var(--color-category-monitoring);
}
.course-outline__header--forensics {
  background-color: var(--color-category-forensics);
}
.course-outline__header--malware {
  background-color: var(--color-category-malware);
}
.course-outline__header--attack {
  background-color: var(--color-category-attack);
}
.course-outline__header--incident {
  background-color: var(--color-category-incident);
}
.course-outline__header--assessment {
  background-color: var(--color-category-assessment);
}
.course-outline__header--competition {
  background-color: var(--color-category-competition);
}
.course-outline__header--webdev {
  background-color: var(--color-category-webdev);
}
.course-outline__header--certification {
  background-color: var(--color-category-certification);
}
.course-outline__header--phishing {
  background-color: var(--color-category-phishing);
}
.course-outline__header--elearning {
  background-color: var(--color-category-elearning);
}
.course-outline__header--other {
  background-color: var(--color-category-other);
}
@media (max-width: 767px) {
  .course-outline__header {
    display: none;
  }
}
.course-outline__title {
  font-size: 1.8rem;
  font-weight: 700;
}
.course-outline__subttl {
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .course-outline__body {
    margin-bottom: 5rem;
    border: solid 1px #A8A8A8;
  }
}
.course-outline__box01 {
  padding: min(2rem, 1.2vw);
}
@media (max-width: 767px) {
  .course-outline__box01 {
    padding: 2rem;
  }
}
.course-outline__box02 {
  padding: min(2rem, 1.2vw);
  background-color: #E8E8E8;
}
@media (max-width: 767px) {
  .course-outline__box02 {
    padding: 2rem;
  }
}
.course-outline__box03 {
  padding: min(2rem, 1.2vw);
  border-top: solid 1px #E8E8E8;
  background-color: #FFF;
}
@media (max-width: 767px) {
  .course-outline__box03 {
    padding: 2rem;
  }
}
.course-outline__time {
  padding: 0.5rem;
  background-color: #E5E5E5;
  text-align: center;
  font-size: 1.3rem;
  color: var(--color-secondary);
}
.course-outline__price {
  margin: 1.5rem 0;
  display: flex;
  flex-direction: column;
  line-height: 1.4;
  font-size: min(2.1rem, 1.8vw);
}
@media (max-width: 767px) {
  .course-outline__price {
    font-size: 2rem;
  }
}
.course-outline__price-notes {
  margin-bottom: 2rem;
  font-size: min(1.2rem, 1.1vw);
}
.course-outline__price-notes > *:not(:first-child) {
  margin-top: 0.5rem;
}
.course-outline__price-notes ul {
  margin-left: 1.2em;
}
.course-outline__price-notes ul li {
  margin-top: 0.3rem;
  list-style-type: disc;
}
.course-outline__price-notes a {
  text-decoration: underline;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .course-outline__price-notes {
    line-height: 1.5;
    font-size: 1.3rem;
  }
}
.course-outline__hr {
  margin: min(1.5rem, 1vw) 0;
  border: none;
  border-top: solid 1px #B6C2D9;
}
.course-outline__hr:first-child {
  display: none;
}
@media (max-width: 767px) {
  .course-outline__hr {
    margin: 1.5rem 0;
  }
}
.course-outline__notes {
  display: block;
  margin-top: 1rem;
  font-size: min(1.3rem, 1.1vw);
}
@media (max-width: 767px) {
  .course-outline__notes {
    font-size: 1.3rem;
  }
}
.course-outline__buttons {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: min(1rem, 0.5vw);
}
@media (max-width: 767px) {
  .course-outline__buttons {
    gap: 1rem;
  }
}
.course-outline__button {
  min-height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: min(1.5rem, 1.3vw);
  color: #FFF;
  transition: background-color 0.2s ease;
}
@media (max-width: 767px) {
  .course-outline__button {
    font-size: 1.5rem;
  }
}
.course-outline__button--primary {
  background-color: var(--color-primary);
}
.course-outline__button--primary:hover {
  background-color: color-mix(in srgb, var(--color-primary) 80%, #FFF);
}
.course-outline__button--secondary {
  background-color: #65A2BE;
}
.course-outline__button--secondary:hover {
  background-color: color-mix(in srgb, #65A2BE 80%, #FFF);
}
.course-outline__button--tertiary {
  background-color: #FFF;
  font-size: 1.3rem;
  color: var(--color-text-body);
}
.course-outline__button--tertiary em {
  color: var(--color-text-link);
}
.course-outline__button--tertiary:hover {
  background-color: color-mix(in srgb, #65A2BE 10%, #FFF);
}
.course-outline__links {
  margin-top: 1rem;
}
.course-outline__links li a {
  font-size: 1.3rem;
  color: var(--color-text-link);
}
.course-outline__links li a::before {
  content: "-";
  margin-right: 0.5rem;
}

/* コース受講料 for SP
------------------------------ */
@media (max-width: 767px) {
  .sp-fixed-cta {
    position: fixed;
    z-index: 10;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 5.5rem;
    padding: 2% 5.5rem 2% 5%;
    border-top: solid 1px #707070;
    background-color: #FFF;
    display: flex;
    align-items: center;
  }
  .sp-fixed-cta__price {
    flex: 1;
    line-height: 1.5;
  }
  .sp-fixed-cta__button a {
    display: block;
    padding: 0.5rem 1.5rem;
    background-color: var(--color-primary);
    color: #FFF;
  }
}

/* コース本文
------------------------------ */
.course-content {
  width: 65%;
  margin: 0 auto 0 5%;
  padding: 3rem 0;
  line-height: 1.86;
}
@media (max-width: 767px) {
  .course-content {
    width: 92%;
    margin: 0 auto;
  }
}

/* MTブロックエディタ
------------------------------ */
.mt-block {
  margin: 6rem auto;
}
.mt-block:first-child {
  margin-top: 0;
}
@media (max-width: 767px) {
  .mt-block {
    margin: 4rem auto;
  }
}
.mt-block p + p {
  margin-top: 1rem;
}
.mt-block a:not(.c-btn, .course-row) {
  color: var(--color-text-link);
}
@media (hover: hover) {
  .mt-block a:not(.c-btn, .course-row) img {
    transition: opacity 0.2s ease;
  }
  .mt-block a:not(.c-btn, .course-row):hover {
    text-decoration: underline;
  }
  .mt-block a:not(.c-btn, .course-row):hover img {
    opacity: 0.7;
  }
}
.mt-block__title {
  margin-bottom: 2rem;
  font-size: 2.1rem;
  color: var(--color-primary);
}
.mt-block__title:not(:first-child) {
  margin-top: 6rem;
}
.mt-block__title::before {
  content: "-";
}
.mt-block__title::after {
  content: "-";
}
@media (max-width: 767px) {
  .mt-block__title {
    margin-bottom: 1.6rem;
    font-size: 1.8rem;
  }
  .mt-block__title:not(:first-child) {
    margin-top: 4rem;
  }
}
.mt-block__subttl {
  margin-bottom: 0.5rem;
  font-size: 1em;
}
.mt-block__subttl:not(:first-child) {
  margin-top: 2rem;
}
.mt-block__box {
  padding: min(5%, 2rem);
}
.mt-block__box--gray {
  background-color: #EBEBEB;
}
.mt-block__box--lightblue {
  border: solid 1px #B6C2D9;
  background-color: #F0F5F9;
}
.mt-block__list:not(:first-child) {
  margin-top: 2rem;
}
.mt-block__list:not(:last-child) {
  margin-bottom: 2rem;
}
.mt-block__list--default > li {
  position: relative;
  padding-left: 1em;
}
.mt-block__list--default > li::before {
  content: "○";
  position: absolute;
  top: 0.7em;
  left: 0;
  font-size: 0.6em;
}
.mt-block__list--default > li ul {
  margin-left: 0;
}
.mt-block__list--default > li ul li {
  position: relative;
  padding-left: 1em;
}
.mt-block__list--default > li ul li::before {
  content: "-";
  position: absolute;
  left: 0;
}
.mt-block__list--circle li {
  position: relative;
  padding-left: 2.5rem;
}
.mt-block__list--circle li:not(:last-child) {
  margin-bottom: 0.5rem;
}
.mt-block__list--circle li::before {
  content: "";
  position: absolute;
  top: 0.7rem;
  left: 0;
  width: 1.7rem;
  aspect-ratio: 1;
  border: solid 0.5rem #BDC8DD;
  border-radius: 50%;
}
.mt-block__list--circle-sm li {
  padding-left: 2rem;
}
.mt-block__list--circle-sm li::before {
  width: 1.3rem;
  border-width: 0.3rem;
}
.mt-block__list--keyword {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem 1rem;
}
.mt-block__list--keyword li {
  padding: 1.4rem 3rem;
  background-color: #E8E8E8;
  line-height: 1;
}
.mt-block__list--kome li {
  position: relative;
  padding-left: 1.2em;
}
.mt-block__list--kome li::before {
  content: "※";
  position: absolute;
  left: 0;
}
.mt-block__list--kome-notes li {
  padding-left: 1em;
  text-indent: -1em;
  line-height: 1.6;
}
@media (max-width: 767px) {
  .mt-block__list--keyword {
    gap: 1rem;
  }
  .mt-block__list--keyword li {
    padding: 1rem;
    font-size: 1.3rem;
    font-weight: 700;
  }
}
.mt-block__table {
  width: 100%;
  border: solid #A7A7A7;
  border-width: 1px 0;
}
.mt-block__table:not(:first-child) {
  margin-top: 2rem;
}
.mt-block__table:not(:last-child) {
  margin-bottom: 2rem;
}
.mt-block__table th, .mt-block__table td {
  padding: 1.5rem;
  border: solid 1px;
  vertical-align: top;
  line-height: 1.6;
  text-align: left;
  font-weight: 400;
}
.mt-block__table th {
  background-color: #F0F5F9;
  border-color: #A7A7A7 #FFF;
}
.mt-block__table th:first-child {
  border-left-color: #F0F5F9;
}
.mt-block__table th:last-child {
  border-right-color: #F0F5F9;
}
.mt-block__table td {
  border-color: #A7A7A7 #EBEBEB;
}
.mt-block__table td:first-child {
  border-left-color: #FFF;
}
.mt-block__table td:last-child {
  border-right-color: #FFF;
}
@media (max-width: 767px) {
  .mt-block__table th, .mt-block__table td {
    padding: 0.75rem 0.5rem;
    line-height: 1.5;
    font-size: 1.3rem;
  }
}
.mt-block__table thead th, .mt-block__table .thead th {
  padding: 0.5rem 1.5rem;
  border: solid #FFF;
  border-width: 0 1px;
  background-color: #5C709D;
  vertical-align: middle;
  text-align: left;
  font-weight: 400;
  color: #FFF;
}
@media (max-width: 767px) {
  .mt-block__table thead th, .mt-block__table .thead th {
    padding: 0.5rem;
  }
}
.mt-block__table--rowheader th:first-child {
  width: 18rem;
}
.mt-block__table--rowheader ul li {
  position: relative;
  padding-left: 1em;
}
.mt-block__table--rowheader ul li::before {
  content: "-";
  position: absolute;
  left: 0;
}
@media (max-width: 767px) {
  .mt-block__table--rowheader th:first-child {
    width: 30%;
  }
}
.mt-block__table--curriculum th:first-child {
  min-width: 9.5rem;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}
.mt-block__table--curriculum ol {
  margin-left: 1.8rem;
}
.mt-block__table--curriculum ol li {
  list-style-type: decimal;
  font-weight: 700;
}
.mt-block__table--curriculum ul li {
  position: relative;
  padding-left: 1em;
}
.mt-block__table--curriculum ul li::before {
  content: "○";
  position: absolute;
  top: 0.5em;
  left: 0;
  font-size: 0.6em;
}
.mt-block__table--curriculum ul li ul {
  margin-left: 0;
}
.mt-block__table--curriculum ul li ul li {
  position: relative;
  padding-left: 1em;
}
.mt-block__table--curriculum ul li ul li::before {
  content: "-";
  position: absolute;
  left: 0;
}
@media (max-width: 767px) {
  .mt-block__table--curriculum tbody th:first-child {
    min-width: initial;
    width: 15%;
  }
}
.mt-block__table--schedule td p + p {
  margin: 0;
}
.mt-block__table--schedule td:first-child ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}
.mt-block__table--schedule td:first-child ul:not(:first-child) {
  margin-top: 0.5rem;
}
.mt-block__table--schedule td:first-child ul:not(:last-child) {
  margin-bottom: 0.5rem;
}
.mt-block__table--schedule td:first-child ul li a {
  min-width: 13.5rem;
  padding: 0 1rem;
  border-radius: 0.3rem;
  background-color: #F0F5F9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.mt-block__table--schedule td:first-child ul li a::after {
  content: "";
  width: 0.6rem;
  aspect-ratio: 1/1;
  border: solid currentColor;
  border-width: 1px 1px 0 0;
  transform: rotate(135deg);
}
@media (hover: hover) {
  .mt-block__table--schedule td:first-child ul li a:hover {
    background-color: var(--color-secondary);
    text-decoration: none !important;
    color: #FFF;
  }
}
@media (max-width: 767px) {
  .mt-block__table--schedule td:first-child {
    width: 70%;
  }
}
.mt-block__table--requirements tbody th:first-child {
  width: 12%;
}
.mt-block__table--requirements tbody td {
  width: 22%;
}
.mt-block__streaming-heading {
  position: relative;
  margin: 2rem 0;
  padding-left: 2rem;
  line-height: 1.4;
  font-size: 1.8rem;
  color: var(--color-primary);
}
.mt-block__streaming-heading::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0.9rem;
  aspect-ratio: 9/8;
  background-color: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.mt-block__streaming-inner {
  margin: 1rem 0 4rem 2rem;
}
.mt-block__accordion-head {
  position: relative;
  padding: 1rem 2rem;
  background-color: #EBEBEB;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.mt-block__accordion-head:hover {
  background-color: var(--color-primary-subtle);
}
.mt-block__accordion-head::before {
  content: "";
  position: absolute;
  top: calc(50% - 1.7rem);
  right: 1rem;
  width: 3.4rem;
  aspect-ratio: 1;
  border-radius: 0.5rem;
  background-color: #FFF;
}
.mt-block__accordion-head::after {
  content: "";
  position: absolute;
  top: calc(50% - 1rem);
  right: 1.7rem;
  width: 2rem;
  aspect-ratio: 1;
  -webkit-mask: url(/education/assets/images/common/accordion-icon-on.svg) center center/contain no-repeat;
          mask: url(/education/assets/images/common/accordion-icon-on.svg) center center/contain no-repeat;
  background-color: var(--color-primary);
}
.mt-block__accordion-head.is-open::after {
  -webkit-mask-image: url(/education/assets/images/common/accordion-icon-off.svg);
          mask-image: url(/education/assets/images/common/accordion-icon-off.svg);
}
.mt-block__accordion-body {
  display: none;
  overflow: auto;
  padding: 3rem 2rem;
  border: solid 1px #EBEBEB;
}
@media (max-width: 767px) {
  .mt-block__accordion-head::before {
    top: calc(50% - 1.5rem);
    width: 3rem;
    border-radius: 0.3rem;
  }
  .mt-block__accordion-head::after {
    content: "";
    position: absolute;
    top: calc(50% - 0.8rem);
    right: 1.7rem;
    width: 1.6rem;
  }
  .mt-block__accordion-body {
    padding: 1.5rem 1rem;
  }
}

.mt-entry-body a[target=_blank] {
  display: inline;
  overflow-wrap: anywhere;
}
.mt-entry-body a[target=_blank]::after {
  content: "";
  display: inline-block;
  width: 1em;
  aspect-ratio: 1;
  margin-left: 0.2em;
  margin-right: 0.5rem;
  background-color: currentColor;
  -webkit-mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
          mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
}
.mt-entry-body a[href*=".pdf"]::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.6em;
  margin-left: 0.5em;
  aspect-ratio: 1;
  background: url(/education/assets/images/common/link-icon-pdf.webp) center center/contain no-repeat;
  -webkit-mask: none;
          mask: none;
}

@media (max-width: 767px) {
  .table-wrap {
    width: calc(100% + 4vw);
    margin-right: -4vw;
    overflow-x: auto;
  }
  .table-wrap .mt-block__table {
    min-width: 54rem;
    margin: 0 4vw 0 0;
  }
}

/* 講師情報
------------------------------ */
.course-instructor__item {
  display: grid;
  grid-template-columns: min(24rem, 30%) 1fr;
  grid-template-rows: auto auto 1fr auto;
  grid-template-areas: "photo      name-block" "photo      profile" "photo      button";
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
.course-instructor__item:not(:last-child) {
  margin-bottom: var(--space-md);
}
.course-instructor__item p + p {
  margin-top: 0;
}
@media (max-width: 767px) {
  .course-instructor__item {
    grid-template-columns: 24% 1fr;
    grid-template-rows: auto auto auto auto;
    grid-template-areas: "photo      name-block" "profile    profile" "button     button";
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
  }
}
.course-instructor__category {
  grid-area: category;
  margin-bottom: 1.5rem;
  font-size: 1.8rem;
  font-weight: 700;
}
@media (max-width: 767px) {
  .course-instructor__category {
    margin-bottom: 0;
    font-size: 1.5rem;
  }
}
.course-instructor__photo {
  grid-area: photo;
}
.course-instructor__photo figure {
  border: solid 1px #E0E0E0;
  border-radius: 1rem;
  overflow: hidden;
}
.course-instructor__name-block {
  grid-area: name-block;
  line-height: 1.44;
}
@media (max-width: 767px) {
  .course-instructor--dept {
    font-size: 1.3rem;
  }
}
.course-instructor__name {
  font-size: 2.5rem;
  font-weight: 400;
}
@media (max-width: 767px) {
  .course-instructor__name {
    font-size: 2.1rem;
  }
}
.course-instructor__profile {
  grid-area: profile;
  margin-top: 1rem;
  line-height: 1.66;
}
.course-instructor__button {
  grid-area: button;
  text-align: right;
  padding-top: 2rem;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
@media (max-width: 767px) {
  .course-instructor__button a {
    width: 90%;
    margin: 0 auto;
  }
}

/* お見積書発行・お問い合わせ
------------------------------ */
.course-contact {
  display: grid;
  grid-template-columns: 13.5rem 1fr;
  grid-template-rows: repeat(2, 1fr);
  align-items: center;
  gap: 1.5rem 3rem;
}
.course-contact dt {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
@media (max-width: 767px) {
  .course-contact {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, auto);
    gap: 0;
  }
  .course-contact dt {
    width: 13.5rem;
    margin-bottom: 0.5rem;
  }
  .course-contact dt:not(:first-child) {
    margin-top: 1.5rem;
  }
}

/* ========================================
CISSP CBKトレーニング
/course/cissp.html
======================================== */
.cissp {
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .cissp {
    font-size: 1.2rem;
  }
}
.cissp .mt-block__accordion-body, .cissp__body {
  height: min(600px, 50vh);
}
.cissp__heading {
  font-size: 2.1rem;
}
@media (max-width: 767px) {
  .cissp__heading {
    font-size: 1.6rem;
  }
}
.cissp h3 {
  position: relative;
  margin-bottom: 2.5rem;
  padding-bottom: 1.8rem;
  border-bottom: solid 1px #707070;
  line-height: 1.4;
  font-size: 1.8rem;
  color: var(--color-primary);
}
.cissp h3:not(:first-child) {
  margin-top: 5rem;
}
.cissp h3::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary);
}
.cissp h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 8rem;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary-subtle);
}
@media (max-width: 767px) {
  .cissp h3 {
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    font-size: 1.7rem;
  }
  .cissp h3:not(:first-child) {
    margin-top: 4rem;
  }
  .cissp h3::before {
    width: 4rem;
    border-top-width: 0.3rem;
  }
  .cissp h3::after {
    left: 4rem;
    width: 4rem;
    border-top-width: 0.3rem;
  }
}
.cissp h4 {
  margin: 2rem 0 1rem;
  font-size: 1.8rem;
  color: var(--color-primary);
}
.cissp__subheading {
  position: relative;
  margin: 0 !important;
  padding-left: 2rem;
}
.cissp__subheading::before {
  content: "";
  position: absolute;
  top: 0.6em;
  left: 0;
  width: 0.6em;
  aspect-ratio: 1;
  background-color: currentColor;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.cissp ol li {
  margin-left: 2em;
  list-style-type: decimal;
}
.cissp h3 + .mt-block {
  margin: 1rem 0 2rem;
}
.cissp__imgbox {
  display: flex;
  gap: 3rem;
}
.cissp__imgbox-image {
  width: 13.5rem;
}
.cissp__imgbox-text {
  flex: 1;
}
@media (max-width: 767px) {
  .cissp__imgbox {
    display: block;
  }
  .cissp__imgbox-image {
    float: left;
    width: 25%;
    margin: 0 2rem 1rem 0;
  }
}
.cissp-schedule__heading {
  position: static;
  margin: 2rem 0 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.cissp-schedule__heading h3 {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-primary);
}
.cissp-schedule__heading h3::before, .cissp-schedule__heading h3::after {
  content: none;
}
.cissp-schedule__heading p {
  font-size: 1.5rem;
  font-weight: 400;
  color: var(--color-text-important);
}
@media (max-width: 767px) {
  .cissp-schedule__heading {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0;
  }
  .cissp-schedule__heading p {
    font-size: 1.3rem;
  }
}
.cissp-schedule__table {
  margin-top: 1rem;
}
.cissp-schedule__table:not(:first-child) {
  margin-top: 1rem;
}
.cissp-schedule__table th, .cissp-schedule__table td {
  padding: 1rem 0.5rem;
  vertical-align: middle;
  text-align: center;
  font-size: 1.3rem;
}
.cissp-schedule__table tr:nth-child(odd) th {
  background-color: #F0F5F9;
}
.cissp-schedule__table tr:nth-child(odd).thead th {
  background-color: #5C709D;
  text-align: center;
}
.cissp-schedule__table tr:nth-child(even) th {
  background-color: #DFEFFC;
}
.cissp-schedule__table tr:nth-child(even) td {
  background-color: #F7F7F7;
}
@media (max-width: 767px) {
  .cissp-schedule__table {
    width: 78rem;
  }
}
.cissp-special__box {
  padding: 2rem 3rem;
  border-style: solid;
  border-width: 1px 1px 1px 0.5rem;
  border-color: #B6C2D9 #B6C2D9 #B6C2D9 var(--color-primary);
  display: grid;
  grid-template-columns: 1fr 16rem;
  grid-template-rows: auto auto;
  grid-template-areas: "a a" "b c";
  gap: 0 4rem;
}
.cissp-special__box:not(:first-of-type) {
  margin-top: 1rem;
}
@media (max-width: 767px) {
  .cissp-special__box {
    padding: 2rem;
    display: block;
  }
}
.cissp-special__heading {
  grid-area: a;
  margin: 0 0 2rem 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 2.1rem !important;
}
.cissp-special__heading::before, .cissp-special__heading::after {
  content: none !important;
}
.cissp-special__text {
  grid-area: b;
}
.cissp-special__text p {
  font-size: 1.5rem;
}
.cissp-special__image {
  grid-area: c;
  margin-top: 1rem;
  text-align: center;
}
.cissp-special__image.custom {
  margin-top: -4rem;
}
@media (max-width: 767px) {
  .cissp-special__image.custom {
    margin-top: 1.5rem;
    text-align: center;
  }
  .cissp-special__image img {
    width: 60%;
    margin-top: 1.5rem;
  }
}

/* ========================================
CompTIA 資格試験
/course/comptia.html
======================================== */
.comptia-course__table tr.thead th:first-child {
  width: 14.7435897436%;
  text-align: center;
}
.comptia-course__table tr.thead th:last-child {
  width: 41.0256410256%;
}
.comptia-course__table tr:not(.thead) th {
  padding: 1rem 0.5rem;
  text-align: center;
  line-height: 1.3;
  font-size: 2.1rem;
}
.comptia-course__table tr:not(.thead) th img {
  width: 8rem;
}
.comptia-course__table tr td {
  font-size: 1.3rem;
}
.comptia-course__table ul li {
  position: relative;
  padding-left: 1em;
}
.comptia-course__table ul li::before {
  content: "○";
  position: absolute;
  top: 0.7em;
  left: 0;
  font-size: 0.6em;
}
@media (max-width: 767px) {
  .comptia-course__table tr:not(.thead) th {
    font-size: 1.6rem;
  }
  .comptia-course__table tr td {
    font-size: 1.2rem;
  }
}
.comptia-outline {
  display: flex;
  gap: 5.7rem;
}
.comptia-outline div {
  flex: 1;
}
.comptia-outline figure {
  width: 17.2rem;
}
.comptia-outline figure img {
  width: 10rem;
}
.comptia-outline figure figcaption {
  margin-top: 1rem;
  line-height: 1.4;
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .comptia-outline {
    flex-direction: column;
    gap: 2rem;
  }
  .comptia-outline figure {
    width: 100%;
    display: flex;
    gap: 2rem;
  }
  .comptia-outline figure img {
    width: min(25%, 10rem);
  }
}

/* ========================================
講師紹介
/instructors/index.html
======================================== */
/* 講師一覧
------------------------------ */
.instructors .c-accordion:not(.is-open) .c-accordion__head {
  transition: background-color 0.2s;
}
@media (hover: hover) {
  .instructors .c-accordion:not(.is-open) .c-accordion__head:hover {
    background-color: color-mix(in srgb, var(--color-primary) 5%, #FFF 95%);
  }
}
.instructors__title {
  margin: 0 2rem;
  padding: 2.5rem 0;
  font-size: 2.1rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .instructors__title {
    margin: 0 3vw;
    padding: 1.5rem 0;
    font-size: 1.8rem;
  }
}
.instructors__list {
  margin: 0 2rem;
  padding: 2rem 0;
  border-top: solid 1px #E4E4E4;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.7rem;
}
.instructors__list li {
  position: relative;
}
.instructors__list li::before {
  content: "-";
  position: absolute;
  left: 0;
}
.instructors__list li a {
  position: relative;
  padding-left: 1rem;
  color: var(--color-primary);
}
@media (hover: hover) {
  .instructors__list li a:hover {
    text-decoration: underline;
  }
}
@media (max-width: 767px) {
  .instructors__list {
    margin: 0 3vw;
    padding: 1.5rem 0;
    grid-template-columns: repeat(3, 1fr);
  }
}

.instructor {
  margin-top: 8rem;
  display: grid;
  grid-template-columns: 24rem 1fr;
  align-items: start;
  gap: 0 3rem;
  line-height: 1.66;
}
@media (max-width: 767px) {
  .instructor {
    grid-template-columns: 42.0289855072% 1fr;
    grid-auto-flow: row;
    gap: 0 1rem;
  }
}
.instructor__name {
  grid-column: 1/-1;
  margin-bottom: 2rem;
  padding-bottom: 1.6rem;
  border-bottom: solid 0.3rem var(--color-primary);
  display: flex;
  align-items: center;
  gap: 2rem;
  font-weight: 400;
}
.instructor__name-main {
  font-size: 2.5rem;
}
.instructor__name-sub {
  font-family: "Oswald", sans-serif;
  font-weight: 500;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .instructor__name {
    grid-row: 1;
    margin-bottom: 1.5rem;
    padding-bottom: 0.8rem;
  }
  .instructor__name-main {
    font-size: 2.1rem;
  }
}
.instructor__image {
  grid-column: 1;
  grid-row: 2/span 2;
}
.instructor__image img {
  border: solid 1px #E0E0E0;
  border-radius: 1rem;
}
@media (max-width: 767px) {
  .instructor__image {
    grid-row: 2;
    margin-bottom: 2rem;
  }
}
.instructor__message {
  grid-column: 2;
  grid-row: 2;
  margin-bottom: 2rem;
  padding: 1.5rem 2rem 2rem;
  border-radius: 1rem;
  background-color: #E2F0FD;
}
.instructor__message dt {
  margin-bottom: 1rem;
  font-family: "Oswald", sans-serif;
  font-weight: 500;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .instructor__message {
    grid-row: 2;
    margin-bottom: 0;
    padding: 1rem 1.3rem;
  }
  .instructor__message dt {
    margin-bottom: 0.5rem;
  }
  .instructor__message dd {
    font-size: 1.3rem;
  }
}
.instructor__profile {
  grid-column: 2;
  display: flex;
  gap: 2rem;
}
.instructor__profile dt {
  white-space: nowrap;
}
.instructor__profile dd {
  flex: 1;
  padding-left: 2rem;
  border-left: solid 1px #E4E4E4;
}
@media (max-width: 767px) {
  .instructor__profile {
    grid-column: 1/-1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1rem;
    font-size: 1.3rem;
  }
  .instructor__profile dd {
    padding-top: 1rem;
    padding-left: 0;
    border-top: solid 1px #E4E4E4;
    border-left: none;
  }
}
.instructor__achievements {
  grid-column: 1/-1;
  margin-top: 2rem;
  border-top: solid 1px #A7A7A7;
  border-left: solid 0.5rem #5C709D;
}
.instructor__achievements th, .instructor__achievements td {
  padding: 1.5rem 2rem;
  border-bottom: solid 1px #A7A7A7;
  vertical-align: top;
  text-align: left;
}
.instructor__achievements th {
  width: 24rem;
  background-color: #F4F4F4;
  font-weight: 400;
}
.instructor__achievements td ul li {
  position: relative;
  padding-left: 1.5rem;
}
.instructor__achievements td ul li::before {
  content: "-";
  position: absolute;
  left: 0;
}
@media (max-width: 767px) {
  .instructor__achievements {
    font-size: 1.3rem;
  }
  .instructor__achievements th, .instructor__achievements td {
    padding: 1rem;
  }
  .instructor__achievements th {
    width: 33.6231884058%;
  }
}

/* ========================================
カタログダウンロード
/download/
======================================== */
.download-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3.6rem 7rem;
}
.download-list li a {
  width: 100%;
}
@media (max-width: 767px) {
  .download-list {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

/* ========================================
よくあるご質問
/faq/
======================================== */
.faq-nav__list {
  margin: 0 2rem;
  padding: 2rem;
  border-top: solid 1px #E4E4E4;
  display: flex;
  gap: 4rem;
  color: var(--color-primary);
}
.faq-nav__list dt {
  width: 20rem;
  font-weight: 700;
}
.faq-nav__list dd::before {
  content: "-";
  margin-right: 1rem;
}
.faq-nav__list dd a {
  color: currentColor;
}
@media (hover: hover) {
  .faq-nav__list dd a:hover {
    text-decoration: underline;
  }
}
@media (max-width: 767px) {
  .faq-nav__list {
    display: block;
  }
}

.faq-sec {
  margin-top: 8rem;
}
.faq-sec__title {
  position: relative;
  margin-bottom: 5rem;
  padding-bottom: 1.8rem;
  border-bottom: solid 1px #707070;
  line-height: 1.4;
  font-size: 2.8rem;
  color: var(--color-primary);
}
.faq-sec__title::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary);
}
.faq-sec__title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 8rem;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary-subtle);
}
.faq-sec__title span {
  font-size: 2.5rem;
  color: #7591D6;
}
@media (max-width: 767px) {
  .faq-sec {
    margin-top: 5rem;
  }
  .faq-sec__title {
    font-size: 1.8rem;
  }
  .faq-sec__title::before, .faq-sec__title::after {
    width: 4rem;
    border-top-width: 0.3rem;
  }
  .faq-sec__title::after {
    left: 4rem;
  }
  .faq-sec__title span {
    font-size: 1.5rem;
  }
}

.faq-list dt {
  position: relative;
  margin: 5rem 0 3rem;
  padding-left: 4.5rem;
  border-left: solid 0.5rem var(--color-primary);
  font-size: 2.1rem;
  font-weight: 700;
  color: var(--color-primary);
}
.faq-list dt::before {
  content: "Q.";
  position: absolute;
  left: 1.5rem;
}
@media (max-width: 767px) {
  .faq-list dt {
    margin: 3rem 0 1.5rem;
    border-left-width: 0.3rem;
    font-size: 1.7rem;
  }
}
.faq-list dd {
  position: relative;
  padding-left: 5rem;
}
.faq-list dd::before {
  content: "A.";
  position: absolute;
  top: -0.2rem;
  left: 2rem;
  font-size: 2.1rem;
  font-weight: 700;
  color: var(--color-primary);
}
.faq-list dd p {
  line-height: 2;
}
.faq-list dd ul li {
  position: relative;
  margin-top: 1rem;
  padding-left: 1em;
  line-height: 2;
}
.faq-list dd ul li::before {
  content: "・";
  position: absolute;
  left: 0;
}
.faq-list dd em {
  color: var(--color-text-link);
}
@media (max-width: 767px) {
  .faq-list dd::before {
    font-size: 1.7rem;
  }
  .faq-list dd p {
    line-height: 1.8;
  }
  .faq-list dd ul li {
    line-height: 1.8;
  }
}
.faq-list a {
  color: var(--color-text-link);
}
@media (hover: hover) {
  .faq-list a:hover {
    text-decoration: underline;
  }
}

.faq-button {
  padding: 0 1rem;
  border-radius: 0.3rem;
  background-color: #F0F5F9;
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  font-size: 1.3rem;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.faq-button::after {
  content: "";
  width: 0.6rem;
  aspect-ratio: 1;
  border: solid currentColor;
  border-width: 1px 1px 0 0;
  transform: rotate(45deg);
}
.faq-button[href*=".pdf"] {
  gap: 0;
}
.faq-button[href*=".pdf"]::before {
  content: "";
  width: 1.2em;
  aspect-ratio: 1;
  margin-right: 0.5rem;
  background: url(/education/assets/images/common/link-icon-pdf.webp) center center/contain no-repeat;
  order: 1;
}
.faq-button[href*=".pdf"]::after {
  order: 2;
}
@media (hover: hover) {
  .faq-button:hover {
    background-color: var(--color-text-link);
    text-decoration: none !important;
    color: #FFF;
  }
}
@media (max-width: 767px) {
  .faq-button {
    margin: 1rem 0;
  }
}

.faq-separate {
  margin: 8rem 0;
  border: none;
  border-top: solid 0.3rem var(--color-primary);
}

/* ========================================
標的型攻撃メール訓練 T3
/training-services/index.html
======================================== */
.t3-header {
  position: relative;
}

.t3-title {
  position: absolute;
  top: 50%;
  left: 7.5%;
  transform: translateY(-50%);
  width: 33.3333333333%;
}
@media (max-width: 767px) {
  .t3-title {
    top: 55%;
    width: 42.6666666667%;
  }
}

.t3-subttl {
  margin-bottom: 3rem;
  padding-left: 2rem;
  border-left: solid 0.5rem var(--color-primary);
  font-size: 2.8rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .t3-subttl {
    font-size: 2.2rem;
  }
}

.t3-inner {
  width: min(92%, 99.6rem);
  margin: 0 auto;
}

.t3-text--lg {
  line-height: 2.3333333333;
}
.t3-text--md {
  line-height: 1.8666666667;
}
@media (max-width: 767px) {
  .t3-text--lg {
    line-height: 2;
  }
}

.t3-about {
  padding: 5rem 0 6rem;
  background-color: #F0F5F9;
}
.t3-about__title {
  margin-bottom: 3rem;
  text-align: center;
  font-size: 4.1rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .t3-about__title {
    font-size: 2.2rem;
  }
}

.t3-flow {
  margin: 5rem 0;
}
.t3-flow__title {
  margin-bottom: 0;
}
.t3-flow__text {
  margin-bottom: 6rem;
  padding: 2rem 0 1rem 2rem;
  border-left: solid 0.5rem #DDD;
}
.t3-flow__button {
  width: min(90%, 39rem);
}
.t3-flow__button::after {
  transform: rotate(135deg);
}

.t3-cta {
  width: min(92%, 80rem);
  margin: 8rem auto;
}
.t3-cta__button {
  margin-top: 5rem;
  display: flex;
  justify-content: space-around;
  /*justify-content: space-between;*/
}
.t3-cta__button li {
  width: min(49%, 39rem);
}
.t3-cta__button li .c-btn {
  width: 100%;
}
@media (max-width: 767px) {
  .t3-cta__button {
    flex-direction: column;
    gap: 1rem;
  }
  .t3-cta__button li {
    width: min(90%, 39rem);
    margin-inline: auto;
  }
}

.t3-feature {
  margin-bottom: 5rem;
}
.t3-feature__copy {
  margin-bottom: 2rem;
  line-height: 1.4761904762;
  font-size: 2.1rem;
  font-weight: 700;
}
@media (max-width: 767px) {
  .t3-feature__copy {
    font-size: 1.8rem;
  }
}

.t3-achievement {
  padding: 3rem 0;
  background-color: #D0D8ED;
}
.t3-achievement__title {
  margin-bottom: 2rem;
  font-size: 2.1rem;
}
.t3-achievement__list {
  display: flex;
  justify-content: space-between;
}
.t3-achievement__list li {
  width: 23.0923694779%;
}
.t3-achievement__list li figure img {
  display: block;
}
.t3-achievement__list li figure figcaption {
  margin-top: 1rem;
  text-align: center;
  font-size: 1.3rem;
}
@media (max-width: 767px) {
  .t3-achievement__title {
    font-size: 1.8rem;
  }
  .t3-achievement__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  .t3-achievement__list li {
    width: auto;
  }
}

.t3-info__inner {
  max-width: 80rem;
  padding: 8rem 0;
}
.t3-info__title {
  position: relative;
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  text-align: center;
  font-size: 2.8rem;
  color: var(--color-primary);
}
.t3-info__title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: calc(50% - 1rem);
  width: 2rem;
  height: 0;
  border-bottom: solid 1px var(--color-primary);
}
.t3-info__youtube {
  margin-top: 5rem;
  aspect-ratio: 16/9;
}
.t3-info__youtube iframe {
  width: 100%;
  height: 100%;
}

.t3-point {
  padding: 8rem 0;
  background-color: #F0F5F9;
}
.t3-point__title {
  margin-bottom: 8rem;
  text-align: center;
  font-size: 2.8rem;
  font-weight: 400;
}
.t3-point__title > strong {
  display: block;
  line-height: 2;
  font-size: 3.5rem;
  font-weight: 700;
}
.t3-point__title > strong > em {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.3em;
  color: var(--color-primary);
}
.t3-point__box {
  margin: 5rem 0;
  display: grid;
  grid-template-columns: 31.9277108434% 1fr;
  gap: 5rem;
}
.t3-point__text {
  flex: 1;
}
.t3-point__text dt {
  position: relative;
  margin-bottom: 3rem;
  padding-left: 6rem;
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--color-primary);
}
.t3-point__text dt::before {
  content: attr(data-num) "";
  position: absolute;
  left: 0;
  line-height: 1.2;
  font-family: "Oswald", sans-serif;
  font-size: 4.5rem;
}
.t3-point__text dt sup {
  margin-left: 0.2em;
  font-size: 0.5em;
}
.t3-point__text dd {
  line-height: 1.8666666667;
}
@media (max-width: 767px) {
  .t3-point__title {
    font-size: 1.8rem;
  }
  .t3-point__title > strong {
    margin-top: 1rem;
    line-height: 1.8;
    font-size: 2.2rem;
  }
  .t3-point__box {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .t3-point__box dt {
    margin-bottom: 1rem;
    padding-left: 4rem;
    font-size: 2rem;
  }
  .t3-point__box dt::before {
    font-size: 3rem;
  }
  .t3-point__box dt sup {
    font-size: 1.3rem;
  }
}

.t3-plan {
  padding: 8rem 0;
  background-color: #D0D8ED;
}
.t3-plan__title {
  margin-bottom: 5rem;
  text-align: center;
  font-size: 2.8rem;
  color: var(--color-primary);
}
.t3-plan__list {
  margin-bottom: 5rem;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2.1rem;
}
.t3-plan__list-item {
  padding: 6%;
  border-radius: 0.8rem;
  background-color: #FFF;
  box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.16);
}
.t3-plan__list-item p {
  text-align: center;
  font-size: 1.3rem;
}
.t3-plan__name {
  min-height: 6rem;
  margin: 1rem 0 1.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.2;
  text-align: center;
  font-size: 2.5rem;
  color: var(--color-primary);
}
.t3-plan__tag {
  margin-bottom: 2rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem;
}
.t3-plan__tag li {
  padding: 0.6rem 0;
  background-color: #D0D8ED;
  text-align: center;
  font-weight: 700;
  color: var(--color-primary);
}
.t3-plan__table {
  background-color: #FFF;
  font-size: 1.3rem;
}
.t3-plan__table th, .t3-plan__table td {
  height: 6.2rem;
  padding: 1rem 2rem;
  vertical-align: middle;
  line-height: 1.3846153846;
  text-align: center;
}
.t3-plan__table .thead th {
  padding: 1.5rem 1rem;
  text-align: center;
}
.t3-plan__table tr:not(.thead) th {
  text-align: left;
  font-size: 1.5rem;
  font-weight: 700;
  color: #5C709D;
}
.t3-plan__table td p {
  margin: 1rem 0;
  text-align: left;
}
.t3-plan__table td ul li {
  position: relative;
  padding-left: 1em;
  text-align: left;
}
.t3-plan__table td ul li::before {
  content: "・";
  position: absolute;
  left: 0;
}
@media (max-width: 767px) {
  .t3-plan__title {
    font-size: 2.2rem;
  }
  .t3-plan__list {
    grid-template-columns: 1fr;
  }
  .t3-plan__name {
    min-height: initial;
  }
  .t3-plan__table {
    white-space: nowrap;
  }
  .t3-plan__table th, .t3-plan__table td {
    padding: 1rem;
  }
  .t3-plan__table tr:not(.thead) th {
    font-size: 1.3rem;
  }
}

.t3-sample {
  padding: 8rem 0;
  background-color: #F0F5F9;
}
.t3-sample__list {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.1rem;
}
.t3-sample__list a {
  display: block;
}
.t3-sample__list a figure div {
  position: relative;
}
.t3-sample__list a figure div::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid 1px #E0E0E0;
}
.t3-sample__list a figcaption {
  display: block;
  margin-top: 1rem;
  font-weight: 400;
  color: #2B59B6;
}
.t3-sample__list a figcaption::after {
  display: inline-block;
  width: 1em;
  aspect-ratio: 1;
  margin-left: 0.5rem;
  background-color: currentColor;
  -webkit-mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
          mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
}
.t3-sample__list a:hover figcaption {
  text-decoration: underline;
}
.t3-sample__button::after {
  content: none;
}
.t3-sample__button em {
  flex: 1;
  text-align: center;
  font-style: normal;
}
.t3-sample__button em::after {
  content: "";
  display: inline-block;
  width: 0.8em;
  aspect-ratio: 1;
  margin-left: 0.8rem;
  background-color: currentColor;
  -webkit-mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
          mask: url(/education/assets/images/common/link-icon-external.svg) center center/contain no-repeat;
}
@media (max-width: 767px) {
  .t3-sample__list {
    grid-template-columns: 1fr;
  }
}

.t3-related__inner {
  padding-bottom: 8rem;
}
.t3-related ul li {
  margin-top: 1rem;
}
.t3-related ul li a {
  font-weight: 400;
  color: #1A4EA0;
}
.t3-related ul li a:hover {
  text-decoration: underline;
}
@media (max-width: 767px) {
  .t3-related ul li {
    font-size: 1.3rem;
  }
}

.t3-contact {
  margin-top: 5rem;
}
.t3-contact__inner {
  padding: 5rem 0 8rem;
  border-top: solid 1px #707070;
  text-align: center;
}

/* ========================================
SANSトレーニング
/course/sans.html
======================================== */
.sans-block__title {
  margin-bottom: 2.5rem;
  padding-left: 2rem;
  border-left: solid 0.5rem var(--color-primary);
  line-height: 1.44;
  font-size: 2.5rem;
  color: var(--color-primary);
}
.sans-block__inner {
  display: grid;
  grid-template-columns: 1fr 12.2rem;
  gap: 3rem;
}
.sans-block__logo {
  order: 1;
  margin-top: 1rem;
}
@media (max-width: 767px) {
  .sans-block__title {
    font-size: 1.8rem;
  }
  .sans-block__inner {
    display: block;
  }
  .sans-block__logo {
    float: right;
    width: min(30%, 12.2rem);
    margin: 0.5rem 0 0rem 2rem;
  }
}

.sans__heading {
  font-size: 2.1rem;
  font-weight: 700;
}
@media (max-width: 767px) {
  .sans__heading {
    font-size: 1.6rem;
  }
}
.sans__anchor {
  display: grid;
  grid-template-columns: repeat(auto-fit, 9.8rem);
  gap: 1rem;
}
.sans__anchor li a {
  position: relative;
  padding: 0.5rem 1.5rem 0.5rem 1rem;
  display: block;
  border-radius: 0.5rem;
  background-color: #CAD3E6;
  text-align: center;
  color: var(--color-primary) !important;
  transition: background-color 0.2s ease;
}
.sans__anchor li a::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.3rem);
  right: 0.7rem;
  width: 0.7rem;
  aspect-ratio: 7/6;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  background-color: currentColor;
}
@media (hover: hover) {
  .sans__anchor li a:hover {
    background-color: var(--color-primary);
    text-decoration: none !important;
    color: #FFF !important;
  }
}
@media (max-width: 767px) {
  .sans__anchor {
    grid-template-columns: repeat(auto-fit, calc((100% - 1.2rem) / 3));
    gap: 0.6rem;
  }
  .sans__anchor li a {
    padding: 0.5rem 1rem 0.5rem 0.5rem;
  }
}
.sans__table th, .sans__table td {
  padding: 1.5rem 1rem;
}
.sans__table th {
  width: 11.5rem;
}
.sans__table td i {
  margin-right: 0.3rem;
  font-size: 1.2rem;
  color: #999;
}
@media (max-width: 767px) {
  .sans__table th, .sans__table td {
    padding: 0.75rem 0.5rem;
  }
  .sans__table th {
    width: 7rem;
  }
}
.sans h3 {
  position: relative;
  margin-bottom: 2.5rem;
  padding-bottom: 1.8rem;
  border-bottom: solid 1px #707070;
  line-height: 1.4;
  font-size: 1.8rem;
  color: var(--color-primary);
}
.sans h3:not(:first-child) {
  margin-top: 5rem;
}
.sans h3::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary);
}
.sans h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 8rem;
  width: 8rem;
  height: 0;
  border-top: solid 0.5rem var(--color-primary-subtle);
}

/* ========================================
研修風景
/training/case/index.html
======================================== */
.case-header {
  position: relative;
}
.case-header__inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0 7.5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.case-header__title {
  margin-bottom: 1rem;
  font-size: 4.1rem;
  color: var(--color-primary);
}
@media (max-width: 767px) {
  .case-header__image {
    position: relative;
    height: 50vw;
    overflow: hidden;
  }
  .case-header__image img {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: block;
    width: 200%;
    max-width: initial;
  }
  .case-header__inner {
    position: static;
    padding: 5%;
    background-color: #DDE6ED;
  }
  .case-header__title {
    font-size: 2.2rem;
  }
}

.case-body {
  padding-top: 2rem;
}

.case-maincopy {
  width: 88.5542168675%;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .case-maincopy {
    width: 102%;
    margin-left: -2%;
  }
}

.case-section {
  margin-top: 8rem;
}
.case-section__inner {
  width: min(96%, 94.6rem);
  margin-inline: auto;
}
.case-section p {
  margin-top: 1rem;
  line-height: 1.9444444444;
  font-size: 1.8rem;
}
@media (max-width: 767px) {
  .case-section {
    margin-top: 4rem;
  }
  .case-section p {
    font-size: 1.5rem;
  }
}

.case-message {
  position: relative;
  padding: 3rem 4.5180722892% 3rem 20.0803212851%;
  border-radius: 3rem;
  background-color: #E7F4E7;
}
.case-message + .case-section {
  margin-top: 5.2rem;
}
.case-message--type01 {
  margin-top: 3rem;
}
.case-message--type02 {
  margin-top: 3rem;
}
.case-message--type05 {
  margin-top: 3rem;
}
.case-message__image {
  position: absolute;
}
.case-message__image--type01 {
  bottom: 0;
  left: 4.5180722892%;
  width: 12.5502008032%;
}
.case-message__image--type02 {
  bottom: 0;
  left: 4.5180722892%;
  width: 13.7550200803%;
}
.case-message__image--type05 {
  top: 50%;
  left: 4.5180722892%;
  transform: translateY(-50%);
  width: 13.9558232932%;
}
.case-message__text {
  line-height: 1.9444444444;
  font-size: 1.8rem;
  font-weight: 700;
  color: #2398AA;
}
@media (max-width: 767px) {
  .case-message {
    display: flex;
    align-items: top;
    padding: 2rem 2rem 2rem 1rem;
    border-radius: 1.2rem;
    gap: 1rem;
  }
  .case-message + .case-section {
    margin-top: 2rem;
  }
  .case-message__image {
    position: static;
    width: 20%;
  }
  .case-message__image--type05 {
    transform: none;
  }
  .case-message__text {
    flex: 1;
    line-height: 1.6;
    font-size: 1.4rem;
  }
}

.case-subttl {
  margin-bottom: 3.5rem;
  padding: 1.5rem 4rem;
  border-radius: 2.5rem;
  background-color: var(--color-primary);
  color: #FFF;
  display: flex;
  align-items: center;
  gap: 2rem;
}
.case-subttl::before {
  content: attr(data-num);
  line-height: 1;
  font-family: "Oswald", sans-serif;
  font-size: 4.5rem;
}
.case-subttl em {
  font-size: 3.5rem;
}
.case-subttl span {
  padding-left: 2rem;
  border-left: solid 1px currentColor;
  font-size: 2.8rem;
}
@media (max-width: 767px) {
  .case-subttl {
    padding: 1rem 2rem 1.3rem;
    border-radius: 1.2rem;
    flex-wrap: wrap;
    gap: 1rem;
  }
  .case-subttl::before {
    font-size: 2.6rem;
  }
  .case-subttl em {
    font-size: 2.2rem;
  }
  .case-subttl span {
    width: 100%;
    padding: 1rem 0 0;
    border-top: solid 1px currentColor;
    border-left: none;
    font-size: 1.8rem;
  }
}

.case-flow {
  margin-top: 4rem;
  display: flex;
}
.case-flow li {
  width: 25.8985200846%;
  aspect-ratio: 245/60;
  -webkit-mask: url(/education/assets/images/training/case/case-flow-mask.svg) 100% 100%/contain no-repeat;
          mask: url(/education/assets/images/training/case/case-flow-mask.svg) 100% 100%/contain no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-primary);
}
.case-flow li:nth-child(1) {
  z-index: 4;
  background-color: #EAEEF8;
}
.case-flow li:nth-child(2) {
  z-index: 3;
  background-color: #DAE0EF;
}
.case-flow li:nth-child(3) {
  z-index: 2;
  background-color: #CCD5ED;
}
.case-flow li:nth-child(4) {
  z-index: 1;
  background-color: #BFC9E3;
}
.case-flow li:not(:first-child) {
  margin-left: -11px;
}
@media (max-width: 767px) {
  .case-flow {
    margin-top: 2rem;
  }
  .case-flow li {
    width: calc(25% + 1rem);
    padding: 0 1.3333333333rem;
    aspect-ratio: 3/2;
    -webkit-mask-size: cover;
            mask-size: cover;
    font-size: min(1.3rem, 3vw);
  }
  .case-flow li:not(:first-child) {
    margin-left: -calc(1.3333333333rem);
  }
}

.case-attention {
  position: relative;
  margin: 3rem 0;
  background-color: #FFC816;
}
.case-attention::before, .case-attention::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 5px;
  background: url(/education/assets/images/training/case/case-attention-border.svg) center center/cover no-repeat;
  line-height: 0;
  overflow: hidden;
}
.case-attention::before {
  top: 0;
}
.case-attention::after {
  bottom: 0;
}
.case-attention p {
  padding: 2.3rem 4rem 2.3rem 3rem;
  display: flex;
  align-items: center;
  gap: 3rem;
  line-height: 1.5555555556;
  font-size: 1.8rem;
  font-weight: 700;
}
.case-attention p::before {
  content: "";
  width: 5.5rem;
  aspect-ratio: 55/48;
  background: url(/education/assets/images/training/case/case-attention-icon.svg) center center/contain no-repeat;
}
.case-attention p span {
  flex: 1;
}
@media (max-width: 767px) {
  .case-attention::before, .case-attention::after {
    height: 3px;
  }
  .case-attention p {
    padding: 1.5rem;
    font-size: 1.4rem;
    gap: 1rem;
  }
  .case-attention p::before {
    width: 3rem;
  }
}

.case-block {
  margin-top: 6.4rem;
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .case-block {
    display: block;
    margin-top: 3rem;
  }
}
.case-block__text {
  width: 46.511627907%;
}
.case-block__text dt {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--color-primary);
}
.case-block__text dt span {
  width: 3.5rem;
  aspect-ratio: 1;
  background-color: var(--color-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2.2rem;
  color: #FFF;
}
.case-block__text dd {
  margin-top: 3rem;
  line-height: 1.9444444444;
  font-size: 1.8rem;
}
@media (max-width: 767px) {
  .case-block__text {
    width: 100%;
  }
  .case-block__text dt {
    font-size: 2rem;
  }
  .case-block__text dt span {
    width: 2.6rem;
    font-size: 1.6rem;
  }
  .case-block__text dd {
    margin-top: 1.5rem;
    line-height: 1.8;
    font-size: 1.5rem;
  }
}
.case-block__message {
  width: 49.4714587738%;
  padding: 2.5rem;
  border-radius: 3rem;
  background-color: #E7F4E7;
}
.case-block__message figure {
  float: right;
}
.case-block__message dl dt {
  margin-bottom: 2rem;
  line-height: 1.4782608696;
  font-size: 2.3rem;
  font-weight: 700;
}
.case-block__message dl dt::first-letter {
  color: #39AE36;
}
.case-block__message dl dd {
  clear: both;
  line-height: 2;
  font-weight: 700;
  color: #2398AA;
}
.case-block__message--type02 figure {
  width: 13.7rem;
  margin: -6rem 1rem 0 0;
}
.case-block__message--type03 figure {
  width: 13.5rem;
  margin: -6rem -1rem 0 0;
}
.case-block__message--type04 figure {
  width: 15rem;
  margin: -6rem -1rem 0 0;
}
@media (max-width: 767px) {
  .case-block__message {
    width: 100%;
    margin-top: 2rem;
    padding-top: 2rem;
    border-radius: 1.2rem;
  }
  .case-block__message--type02 figure {
    width: 30%;
    margin: -3.5rem -1rem 0 0;
  }
  .case-block__message--type03 figure {
    width: 30%;
    margin: -4rem -1.5rem 0 0;
  }
  .case-block__message--type04 figure {
    width: 30%;
    margin: -3rem -1.5rem 0 0;
  }
  .case-block__message dl dt {
    margin-bottom: 1rem;
    font-size: 1.8rem;
  }
  .case-block__message dl dd {
    line-height: 1.6;
    font-size: 1.4rem;
  }
}

.case-images {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.3rem;
}
.case-images figcaption {
  margin-top: 1rem;
  font-size: 1.5rem;
}
@media (max-width: 767px) {
  .case-images {
    grid-template-columns: 1fr;
  }
  .case-images figcaption {
    font-size: 1.3rem;
  }
}

.case-box {
  display: grid;
  grid-template-columns: 50% 1fr;
  gap: 4rem;
}
.case-box p {
  margin-top: 0;
}
@media (max-width: 767px) {
  .case-box {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

.case-voice {
  margin-top: 5rem;
}
.case-voice__header {
  border-bottom: solid 0.5rem var(--color-primary);
  display: flex;
  align-items: center;
  gap: 1rem;
}
.case-voice__image img {
  width: auto;
  height: 9.6rem;
}
.case-voice__title {
  font-size: 2.8rem;
  color: var(--color-primary);
}
.case-voice__body {
  padding: 3rem 4.5rem 4rem;
  background-color: #F5F5F5;
  font-size: 1.8rem;
}
.case-voice__body p {
  line-height: 1.9444444444;
}
.case-voice__body ul li::before {
  top: 0.5rem;
}
.case-voice__body ul li:not(:last-child) {
  margin-bottom: 1.5rem;
}
@media (max-width: 767px) {
  .case-voice {
    margin-top: 3rem;
  }
  .case-voice__header {
    border-bottom-width: 0.3rem;
  }
  .case-voice__image img {
    height: 5rem;
  }
  .case-voice__title {
    font-size: 2.2rem;
  }
  .case-voice__body {
    padding: 5% 6% 6%;
    font-size: 1.4rem;
  }
  .case-voice__body p {
    line-height: 1.7;
  }
  .case-voice__body ul li::before {
    top: 0.3rem;
  }
}

.case-style__title {
  font-size: 2.8rem;
}
.case-style__table th {
  width: 50%;
}
.case-style__text {
  min-height: 3em;
}
.case-style__image {
  text-align: center;
}
@media (max-width: 767px) {
  .case-style__title {
    font-size: 2rem;
  }
  .case-style__text {
    min-height: 5em;
  }
}

.case-movie {
  margin-top: 7rem;
}
.case-movie__title {
  margin-bottom: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
  font-size: 2.8rem;
  color: var(--color-primary);
}
.case-movie__title::after {
  content: "";
  width: 2rem;
  height: 0;
  border-bottom: solid 1px currentColor;
}
.case-movie__youtube {
  width: min(72rem, 100%);
  aspect-ratio: 966/543;
  margin: 0 auto;
}
.case-movie__youtube iframe {
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  .case-movie {
    margin-top: 5rem;
  }
  .case-movie__title {
    font-size: 2.2rem;
    gap: 1.5rem;
  }
}

.case-button {
  background-color: #F0F5F9;
}
.case-button__inner {
  width: min(92%, 99.6rem);
  margin: 0 auto;
  padding: 8rem 0 6rem;
}
.case-button__list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem 3.6rem;
}
.case-button__list li {
  flex: 1;
}
.case-button__button {
  padding: 1.9rem 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  box-shadow: 0.3rem 0.3rem 1rem rgba(0, 0, 0, 0.25);
  text-align: center;
  font-size: 1.6rem;
}
.case-button__button::after {
  content: none;
}
@media (max-width: 767px) {
  .case-button__inner {
    padding: 4rem 0;
  }
  .case-button__list {
    flex-direction: column;
  }
  .case-button__list li {
    width: 100%;
  }
  .case-button__button {
    font-size: 1.3rem;
  }
}

.case-recommend__inner {
  width: min(92%, 99.6rem);
  margin: 0 auto;
  padding: 8rem 0 6rem;
}
.case-recommend__title {
  position: relative;
  margin-bottom: 3rem;
  padding: 0.9rem 1rem 1rem;
  background-color: var(--color-primary);
  text-align: center;
  font-size: 2.8rem;
  color: #FFF;
}
.case-recommend__title::after {
  content: "";
  position: absolute;
  bottom: -1rem;
  left: calc(50% - 1rem);
  width: 2rem;
  height: 1rem;
  background-color: var(--color-primary);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.case-recommend__body {
  padding: 3rem;
  background-color: #EFEFEF;
  display: flex;
  flex-direction: row-reverse;
  gap: 2rem 3rem;
}
.case-recommend__text {
  display: flex;
  flex-direction: column;
}
.case-recommend__text p:first-of-type {
  line-height: 1.9444444444;
  font-size: 1.8rem;
}
.case-recommend__text p:last-child {
  margin-top: auto;
  text-align: right;
}
.case-recommend__subttl {
  margin-bottom: 2rem;
  font-size: 2.1rem;
  color: var(--color-secondary);
}
.case-recommend__button {
  width: min(24rem, 100%);
}
@media (max-width: 767px) {
  .case-recommend__inner {
    padding: 4rem 0;
  }
  .case-recommend__title {
    margin-bottom: 2rem;
    font-size: 2rem;
  }
  .case-recommend__body {
    padding: min(5%, 3rem);
    flex-direction: column;
  }
  .case-recommend__body p:first-of-type {
    margin-bottom: 1rem;
    line-height: 1.6;
    font-size: 1.4rem;
  }
  .case-recommend__subttl {
    font-size: 1.8rem;
  }
}/*# sourceMappingURL=pages.css.map */

/* チャットボット表示
------------------------------ */
@media (max-width: 700px) {
  .ul-widget-main-window {
    display: none;
  }
}
iframe.ul-widget-main-window {
  right: 82px !important;
  transition: opacity 0.3s;
}
iframe.ul-widget-main-window.hide {
  opacity: 0 !important;
  pointer-events: none;
}