@charset "UTF-8";
/* ==========================================================================
   academy-test-261016 用 追加スタイル（Figma: 2001:160 / 2001:469）
   academy-style.css の後に読み込む。academy-style.css は本番 academy.html と共用のため触らない。
   ========================================================================== */

/* ---------- Profile（sec-02） PC ---------- */
@media screen and (min-width: 1200px) {
  .sec-02__wrapper {
    padding: 192px 0 168px;
    overflow-x: clip; /* 枠線・白背景のはみ出しで横スクロールが出ないように */
  }
  .sec-02__block {
    width: min(1408px, 100% - 48px);
    margin-left: max(24px, 50% - 768px);
    margin-right: 0;
    padding: 0;
    justify-content: space-between;
  }
  .sec-02__blockimg::after {
    width: 880px;
    height: 544px;
    left: -192px;
    top: -48px;
  }
  /* 白い枠線（左上が開いたフレーム） */
  .sec-02__blockcont::after {
    background: url(../images/r-academy/sec-02-frame.svg) no-repeat center center / 100% 100%;
    width: 816px;
    height: 600px;
    top: -68px;
    left: -204px;
    transform: rotate(180deg);
  }
  .sec-02__blockttl {
    margin: 5px 0 5px;
  }
  .sec-02__blockttl-02 {
    font-weight: 300;
  }
  .sec-02__blockttl-03 {
    font-weight: 300;
    padding-bottom: 34px;
    margin-bottom: 47px;
  }
  .sec-02__blockitem {
    font-weight: 350;
    letter-spacing: .08em;
  }
}

/* ---------- セミナータブ ---------- */
div.seminar-tab-wrap {
  --tab-step: 16px;
  background: linear-gradient(to bottom, #F8F8F8 var(--tab-step), #fff var(--tab-step));
}
.seminar-tab-wrap .seminar-tab-swiper-button-prev,
.seminar-tab-wrap .seminar-tab-swiper-button-next {
  /* 隣のスライドを隠しつつ、上端のグレー帯はタブ全体と揃える */
  background: linear-gradient(to bottom, #F8F8F8 var(--tab-step), #fff var(--tab-step));
}
.seminar-tab-wrap .seminar-tab-swiper-button-prev::before,
.seminar-tab-wrap .seminar-tab-swiper-button-next::before {
  aspect-ratio: 38.3369 / 74.3571;
  height: 37px;
  background-image: url(../images/r-academy/tab-arrow-next.svg);
  background-size: contain;
}
.seminar-tab-wrap .seminar-tab-swiper-button-prev::before {
  transform: none;
  background-image: url(../images/r-academy/tab-arrow-prev.svg);
}
.seminar-tab-wrap .sec-03__tab-headttl {
  font-weight: 300;
  letter-spacing: .08em;
  line-height: 1.3;
  margin-bottom: 12px;
}
.seminar-tab-wrap .sec-03__tab-headdate {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1em;
  width: auto;
  max-width: 100%;
  padding: 0 12px;
  white-space: nowrap;
}
.seminar-tab-wrap .sec-03__tab-headdate.is-slash {
  gap: .5em;
}
.seminar-tab-wrap .sec-03__tab-headdate.is-slash .sec-03__tab-headdate-d + .sec-03__tab-headdate-d::before {
  content: "/";
  margin-right: .5em;
}
@media screen and (max-width: 767px) {
  .seminar-tab-wrap .sec-03__tab-headdate.is-slash {
    gap: .3em;
    padding: 0 8px;
    font-size: 13px;
  }
  .seminar-tab-wrap .sec-03__tab-headdate.is-slash .sec-03__tab-headdate-s {
    font-size: 11px;
  }
  .seminar-tab-wrap .sec-03__tab-headdate.is-slash .sec-03__tab-headdate-d + .sec-03__tab-headdate-d::before {
    margin-right: .3em;
  }
}
@media screen and (min-width: 768px) {
  div.seminar-tab-wrap {
    --tab-step: 24px;
  }
  .seminar-tab-wrap .seminar-tab-swiper-button-prev::before,
  .seminar-tab-wrap .seminar-tab-swiper-button-next::before {
    height: 50px;
  }
  .seminar-tab-wrap .sec-03__tab-headdate {
    width: auto;
    padding: 0 32px;
  }
}
@media screen and (min-width: 1024px) {
  div.seminar-tab-wrap {
    --tab-step: 40px;
    padding-inline: max(80px, 50% - 768px);
  }
  .seminar-tab-wrap .seminar-tab-swiper-button-prev,
  .seminar-tab-wrap .seminar-tab-swiper-button-next {
    width: max(80px, 50% - 768px);
  }
  .seminar-tab-wrap .seminar-tab-swiper-button-prev::before,
  .seminar-tab-wrap .seminar-tab-swiper-button-next::before {
    height: 74px;
  }
  .seminar-tab-wrap .sec-03__tab-headttl {
    margin-bottom: 28px;
  }
  .seminar-tab-wrap .sec-03__tab-headdate {
    padding: 0 48px;
  }
}

/* ---------- セミナー詳細（タブの中身） ---------- */
.sec-03__wrapper.sem {
  position: relative;
  overflow: hidden;
  border-width: 5px;
  padding: 32px 0 72px;
  color: #123D51;
}
@media screen and (min-width: 1024px) {
  .sec-03__wrapper.sem {
    border-width: 9px;
    padding: 87px 0 127px;
  }
}
.sem__inner {
  position: relative;
  padding: 0 20px;
}

/* 実習 / サティフィケイト */
.sem__tags {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 24px;
}
.sem__tag {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 16px;
  border: 1px solid #123D51;
  border-radius: 5px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) {
  .sem__tags {
    position: absolute;
    top: -27px;
    right: max(20px, 50% - 655px);
    margin-bottom: 0;
  }
  .sem__tag {
    height: 40px;
    padding: 0 19px;
    font-size: 20px;
  }
}

.sem__logo {
  width: 200px;
  margin: 0 auto 24px;
}
.sem__logo img {
  display: block;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 1024px) {
  .sem__logo {
    width: 256px;
    margin-bottom: 40px;
  }
}

.sem__ttl {
  text-align: center;
  font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.25;
  letter-spacing: .027em;
  margin-bottom: 40px;
}
.sem__ttl:has(+ .sem__lead) {
  margin-bottom: 16px;
}
.sem__lead {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: .05em;
  margin-bottom: 40px;
}
@media screen and (min-width: 768px) {
  .sem__ttl {
    font-size: 40px;
  }
  .sem__lead {
    font-size: 20px;
  }
}
@media screen and (min-width: 1024px) {
  .sem__ttl {
    font-size: 48px;
    margin-bottom: 72px;
    padding-top: 40px;
  }
  .sem__lead {
    font-size: 22px;
    margin-bottom: 71px;
  }
}

/* 開催概要ボックス */
.sem__info {
  background-color: #E8ECEE;
  padding: 24px 12px 32px;
  margin: 0 auto 56px;
  max-width: 1280px;
}
@media screen and (min-width: 1024px) {
  .sem__info {
    padding: 48px 20px;
    margin-bottom: 88px;
  }
}
.sem__table {
  width: 100%;
  max-width: 1080px;
  margin: -4px auto 20px;
  border-collapse: separate;
  border-spacing: 4px;
  table-layout: fixed;
}
.sem__table th,
.sem__table td {
  text-align: center;
  vertical-align: middle;
}
.sem__table th {
  height: 40px;
  background-color: #123D51;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1;
}
.sem__table td {
  height: 56px;
  padding: 8px 6px;
  background-color: #fff;
  font-size: 13px;
  font-weight: 300;
  line-height: 1.5;
}
.sem__table-col-day { width: 18%; }
.sem__table-col-date { width: 37%; }
@media screen and (min-width: 768px) {
  .sem__table {
    border-spacing: 12px 8px;
    margin: -8px auto 32px;
  }
  .sem__table th {
    height: 48px;
    font-size: 20px;
  }
  .sem__table td {
    font-size: 16px;
  }
}
@media screen and (min-width: 1024px) {
  .sem__table {
    width: calc(1080px + 32px);
    max-width: 100%;
    border-spacing: 16px 8px;
    margin: -8px auto 32px;
  }
  .sem__table-col-day { width: 120px; }
  .sem__table-col-date { width: 400px; }
  .sem__table td {
    font-size: 18px;
    letter-spacing: .08em;
  }
}

.sem__spec {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sem__spec-row {
  display: flex;
  align-items: flex-start;
}
.sem__spec-ttl {
  flex: none;
  width: 80px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #C8D8E0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
}
.sem__spec-txt {
  padding: 6px 0 0 12px;
  font-size: 14px;
  font-weight: 350;
  line-height: 1.5;
  letter-spacing: .08em;
}
@media screen and (min-width: 768px) {
  .sem__spec {
    margin-bottom: 40px;
  }
  .sem__spec-row {
    align-items: center;
  }
  .sem__spec-ttl {
    width: 120px;
    font-size: 16px;
  }
  .sem__spec-txt {
    padding: 0 0 0 24px;
    font-size: 16px;
  }
}

.sem__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 560px;
  max-width: 100%;
  height: 72px;
  margin: 0 auto;
  background-color: #123D51;
  border: 1px solid #123D51;
  color: #fff;
  font-size: 16px;
  font-weight: 350;
  letter-spacing: .08em;
  line-height: 1;
  transition: background-color .3s, color .3s;
}
.sem__btn:hover {
  background-color: #fff;
  color: #123D51;
  opacity: 1;
}
@media screen and (min-width: 1024px) {
  .sem__btn {
    height: 80px;
  }
}

/* 本文ブロック共通 */
.sem__about,
.sem__sec,
.sem__notes {
  position: relative;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
.sem__txt {
  font-size: 15px;
  font-weight: 350;
  line-height: 2;
  letter-spacing: .07em;
}
@media screen and (min-width: 768px) {
  .sem__txt {
    font-size: 16px;
  }
}

/* CoDE について */
.sem__about {
  margin-bottom: 56px;
}
.sem__about-ttl {
  position: relative;
  z-index: 1;
  font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.25;
  letter-spacing: .08em;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(18, 61, 81, .6);
  margin-bottom: 24px;
}
.sem__about .sem__txt {
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .sem__about-ttl {
    font-size: 30px;
  }
}
@media screen and (min-width: 1024px) {
  .sem__about {
    margin-bottom: 73px;
  }
  .sem__about-ttl {
    font-size: 36px;
    margin-bottom: 30px;
  }
}

/* 見出し＋罫線 */
.sem__sec + .sem__sec {
  margin-top: 56px;
}
.sem__sec-ttl {
  display: flex;
  align-items: center;
  gap: 20px;
  font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 16px;
  white-space: nowrap;
}
.sem__sec-ttl::after {
  content: "";
  flex: 1;
  height: 1px;
  background-color: #CCCCCE;
}
@media screen and (min-width: 1024px) {
  .sem__sec + .sem__sec {
    margin-top: 72px;
  }
  .sem__sec-ttl {
    font-size: 32px;
    margin-left: -12px;
  }
}

/* 画像 */
.sem__imgs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 16px;
}
.sem__img {
  width: calc((100% - 16px) / 2);
}
.sem__img img {
  display: block;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .sem__imgs {
    gap: 40px;
  }
  .sem__img {
    width: 320px;
  }
}

/* > 付きリスト */
.sem__list > li {
  position: relative;
  padding-left: 24px;
}
.sem__list > li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 4px;
  width: 8.12px;
  height: 13.41px;
  background: url(../images/r-academy/list-arrow.svg) no-repeat center / 100% 100%;
}
@media screen and (min-width: 1024px) {
  .sem__list > li {
    padding-left: 32px;
  }
  .sem__list > li::before {
    left: 7px;
  }
}

/* ラベル付きの行（プログラム・開催日時） */
.sem__rows {
  display: flex;
  flex-direction: column;
}
.sem__row {
  display: flex;
  align-items: flex-start;
}
.sem__row-label {
  flex: none;
  min-width: 64px;
  height: 24px;
  margin-top: 4px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #E8ECEE;
  font-size: 14px;
  font-weight: 350;
  letter-spacing: .08em;
  line-height: 1;
  white-space: nowrap;
}
.sem__row-body {
  flex: 1;
  min-width: 0;
}
.sem__row-body.sem__list > li {
  padding-left: 32px;
}
.sem__row-body.sem__list > li::before {
  left: 14px;
}
.sem__rows.is-group .sem__row + .sem__row {
  margin-top: 16px;
}
.sem__sep {
  margin: 0 .75em;
}
@media screen and (max-width: 767px) {
  .sem__sep {
    display: block;
    height: 0;
    margin: 0;
    overflow: hidden;
  }
}
@media screen and (min-width: 1024px) {
  .sem__row-label {
    min-width: 80px;
    margin-left: -4px;
    font-size: 16px;
  }
  .sem__row-body.sem__list > li {
    padding-left: 60px;
  }
  .sem__row-body.sem__list > li::before {
    left: 40px;
  }
}

/* ※注意書き */
.sem__notes {
  margin-top: 56px;
}
.sem__notes > li {
  position: relative;
  padding-left: 1.2em;
}
.sem__notes > li::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (min-width: 1024px) {
  .sem__notes {
    margin-top: 72px;
  }
}

/* 小見出し付きリスト（プログラムの分類） */
.sem__sub {
  display: inline-block;
  margin: 16px 0 4px;
  padding: 4px 12px;
  background-color: #E8ECEE;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: .08em;
  line-height: 1.5;
}
.sem__groups > .sem__sub:first-child {
  margin-top: 0;
}
.sem__groups > .sem__list {
  margin-bottom: 8px;
}
@media screen and (min-width: 768px) {
  .sem__sub {
    font-size: 16px;
  }
}



@media screen and (min-width: 1200px) {
  .mv-cardlink__container {
      padding-left: 0;
      margin-left: -16px;
  }
  .mv-carddate {
      width: 304px;
      height: 48px;
  }
  .mv-card-label {
    font-size: 18px;
    margin-bottom: 12px;
  }
  .mv-card-label p {
    padding: .25em .75em .35em;
    min-height: 32px;
  }
  .mv-cardttl {
    margin-bottom: 24px;
  }
  .mv-cardlink__tap {
    right: 16px;
  }
  .seminar-link.is-ended .seminar-link-inner::before {
    background-color: rgba(216, 216, 216, .75);
  }

}

@media screen and (max-width: 690px) {
  .seminar-link.is-ended .seminar-link-inner::after {
    font-size: 22px;
  }
  .mv-cardttl {
    margin-bottom: 16px;
  }
  .mv-card-label {
    font-size: 15px;
  }
  .mv-card-label p {
    padding: .25em .65em .35em;
    min-height: 26px;
  }

}

@media screen and (min-width: 1024px) {
  .form__box {
    max-width: 880px;
  }
}
