@charset "UTF-8";
/* ▼ -----------可変設定---------- ▼ */
.JK251217graduation {
  /*デザインの値*/
  --pc-width: 1400; /*PCデザイン幅*/
  --sp-width: 750; /*SPデザイン幅*/
  --pc-artboard-width: 510; /*SP共通デザイン幅*/
  --sp-artboard-width: 750; /*PC共通デザイン幅*/
  /*可変率の計算式*/
  --formula: calc(var(--variable) * var(--ratio)); /*SP,PC共通箇所の可変割合の計算式*/
  --formula_pc: calc(var(--variable) * 1); /*PCデザインの可変割合の計算式*/
}

/* PC画面幅 1400px以上 固定 */
@media (min-width: 1401px) {
  .JK251217graduation {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比率 */
    --variable: 1px; /* 固定値（可変しない） */
  }
}
/* PC画面幅 768～1400px 可変 */
@media (min-width: 768px) and (max-width: 1400px) {
  .JK251217graduation {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比率 */
    --variable: calc(100vw / var(--pc-width)); /* 画面幅に基づく可変値 */
  }
}
/* SP画面幅 767px以下 可変 */
@media (max-width: 767px) {
  .JK251217graduation {
    --ratio: 1; /* 比率は1（変わらない） */
    --variable: calc(100vw / var(--sp-width)); /* 画面幅に基づく可変値 */
  }
}
/* ▲ -----------可変設定---------- ▲ */
body #Contents {
  position: relative;
}

body:has(.JK251217graduation) {
  padding-top: 9.6rem;
}

body:has(.JK251217graduation) .c-breadcrumb {
  position: absolute;
  left: 0;
  z-index: 1;
  color: white;
  padding-top: 0;
}
@media screen and (min-width: 768px) {
  body:has(.JK251217graduation) .c-breadcrumb {
    color: #333333;
    left: 3rem;
  }
}

body:has(.JK251217graduation) .c-breadcrumb .c-breadcrumb__text, body:has(.JK251217graduation) .c-breadcrumb > ol > li:last-child > * {
  color: white;
}
@media screen and (min-width: 768px) {
  body:has(.JK251217graduation) .c-breadcrumb .c-breadcrumb__text, body:has(.JK251217graduation) .c-breadcrumb > ol > li:last-child > * {
    color: #333333;
    left: 3rem;
  }
}

@media screen and (min-width: 768px) {
  body:has(.JK251217graduation) {
    overflow-x: clip !important;
    padding-top: 0;
  }
}
.JK251217graduation {
  background-color: #fffcf3;
}
.JK251217graduation h1, .JK251217graduation h2, .JK251217graduation h3, .JK251217graduation h4, .JK251217graduation p, .JK251217graduation a, .JK251217graduation li {
  font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
  .JK251217graduation {
    display: grid;
    grid-template-columns: 1fr calc(var(--pc-artboard-width) * var(--formula_pc)) 1fr;
  }
}
.JK251217graduation video, .JK251217graduation img {
  width: 100%;
  height: auto;
}
.JK251217graduation #style01, .JK251217graduation #style02, .JK251217graduation #style03 {
  margin-top: calc(-180 * var(--formula));
  padding-top: calc(180 * var(--formula));
}
.JK251217graduation__left-pc, .JK251217graduation__right-pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .JK251217graduation__left-pc, .JK251217graduation__right-pc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100dvh;
    overflow: hidden;
    position: sticky;
    left: 0;
    top: 0;
  }
}
.JK251217graduation__left-pc--text, .JK251217graduation__right-pc--text {
  margin-inline: auto;
  position: relative;
  left: calc(-1 * var(--formula_pc));
}
.JK251217graduation__left-pc--title, .JK251217graduation__right-pc--title {
  text-align: center;
  font-size: calc(36 * var(--formula_pc));
  font-family: "orpheuspro", serif;
  color: #b7825e;
  line-height: 1.38;
  letter-spacing: 0.035em;
  padding-bottom: calc(10 * var(--formula_pc));
}
.JK251217graduation__left-pc--sub-title, .JK251217graduation__right-pc--sub-title {
  font-size: calc(14 * var(--formula_pc));
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0.04em;
  color: #b7825e;
  line-height: 2;
  text-align: center;
}
.JK251217graduation__left-pc ul, .JK251217graduation__right-pc ul {
  margin-inline: auto;
  position: relative;
  left: calc(-6 * var(--formula_pc));
}
.JK251217graduation__left-pc ul li a, .JK251217graduation__right-pc ul li a {
  font-size: calc(20 * var(--formula_pc));
  font-family: "orpheuspro", serif;
  color: #b7825e;
  line-height: 2;
  display: flex;
  align-items: center;
  letter-spacing: 0.04em;
}
.JK251217graduation__left-pc ul li a::before, .JK251217graduation__right-pc ul li a::before {
  content: "";
  background: url("../img/pc-ribbon.svg");
  background-repeat: no-repeat;
  width: calc(28 * var(--formula_pc));
  height: calc(21 * var(--formula_pc));
  display: block;
  margin-right: calc(15 * var(--formula_pc));
  opacity: 0;
  transition: 0.2s;
}
.JK251217graduation__left-pc ul li a:hover, .JK251217graduation__right-pc ul li a:hover {
  cursor: pointer;
}
.JK251217graduation__left-pc ul li.is-active a::before, .JK251217graduation__right-pc ul li.is-active a::before {
  opacity: 1;
  transition: 0.2s;
}
.JK251217graduation__mv__movie video {
  width: 100%;
  height: auto;
  aspect-ratio: 375/667;
}
.JK251217graduation__mv__text {
  margin-bottom: calc(170 * var(--formula));
}
.JK251217graduation__mv__text--img-accent {
  margin: calc(60 * var(--formula)) 0 calc(37 * var(--formula));
}
.JK251217graduation__mv__text h1, .JK251217graduation__mv__text h2 {
  color: #b7825e;
}
.JK251217graduation__mv__text h1 {
  font-family: "orpheuspro", serif;
  font-size: calc(72 * var(--formula));
  text-align: center;
  letter-spacing: 0.04em;
  line-height: 1.38;
  margin-bottom: calc(33 * var(--formula));
}
.JK251217graduation__mv__text h2 {
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(30 * var(--formula));
  text-align: center;
  letter-spacing: 0.04em;
  line-height: 2;
  margin-bottom: calc(53 * var(--formula));
}
.JK251217graduation__mv__text--text p {
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(26 * var(--formula));
  text-align: center;
  letter-spacing: 0.04em;
  line-height: 2;
  margin-bottom: calc(34 * var(--formula));
}
.JK251217graduation .cl-orange {
  color: #b7825e;
}
.JK251217graduation .cl-blue {
  color: #17295b;
}
.JK251217graduation__price {
  margin: calc(30 * var(--formula)) 0 calc(112 * var(--formula));
}
.JK251217graduation__price.text-center {
  text-align: center;
}
.JK251217graduation__price.text-right {
  text-align: right;
  margin-right: calc(35 * var(--formula));
}
.JK251217graduation__price.text-left {
  text-align: left;
  margin-left: calc(41 * var(--formula));
}
.JK251217graduation__price a {
  font-size: calc(22 * var(--formula));
  font-family: "effra", sans-serif;
  font-weight: 500;
  font-style: normal;
  text-decoration: underline;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
  line-height: 2;
  letter-spacing: 0.02em;
  display: inline-block;
}
.JK251217graduation__price__list a + a:not([href*=""]) {
  margin-left: calc(20 * var(--formula));
}
.JK251217graduation__price.margin-b-fix {
  margin-bottom: calc(130 * var(--formula));
}
.JK251217graduation__about-text {
  text-align: center;
}
.JK251217graduation__about-text h3 {
  font-family: "orpheuspro", serif;
  font-size: calc(100 * var(--formula));
}
.JK251217graduation__about-text h4 {
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(42 * var(--formula));
  line-height: 1.67;
}
.JK251217graduation__about-text p {
  text-align: left;
  margin: calc(60 * var(--formula)) auto calc(240 * var(--formula));
  width: calc(625 * var(--formula));
  font-size: calc(24 * var(--formula));
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: justify;
}
.JK251217graduation__about-text__item-img {
  display: flex;
  justify-content: space-between;
  gap: calc(35 * var(--formula));
}
.JK251217graduation__item-right {
  margin-left: auto;
}
.JK251217graduation__content01--img02 {
  width: calc(630 * var(--formula));
}
.JK251217graduation__content01--img03 {
  width: calc(660 * var(--formula));
  position: relative;
  margin-bottom: calc(50 * var(--formula));
}
.JK251217graduation__content01--img03 a {
  position: relative;
  z-index: 2;
}
.JK251217graduation__content01--img03::after {
  content: "";
  height: calc(918 * var(--formula));
  width: calc(655 * var(--formula));
  display: block;
  margin-left: calc(20 * var(--formula));
  position: absolute;
  top: calc(-20 * var(--formula));
  border: 1px solid #b7825e;
  z-index: 0;
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content01--left-text {
    margin-bottom: calc(110 * var(--formula));
  }
}
.JK251217graduation__content01--img04 {
  margin-bottom: calc(105 * var(--formula));
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content01--img04 {
    margin-bottom: calc(106 * var(--formula));
  }
}
.JK251217graduation__content01--img04 li {
  width: calc(546 * var(--formula)) !important;
}
.JK251217graduation__content01--img04 .JK251217graduation__about-text__item-img {
  margin: calc(33 * var(--formula)) calc(30 * var(--formula)) calc(49 * var(--formula));
  gap: calc(5 * var(--formula));
}
.JK251217graduation__content01--img04 .JK251217graduation__about-text__item-img--item {
  width: calc(368 * var(--formula));
}
.JK251217graduation__content01 .JK251217graduation__about-text h4 {
  letter-spacing: 0.05em;
}
.JK251217graduation__content01 .JK251217graduation__about-text p {
  margin: calc(45 * var(--formula)) auto calc(230 * var(--formula));
}
.JK251217graduation__content02--bg-white {
  background-color: white;
  padding-bottom: calc(240 * var(--formula));
}
.JK251217graduation__content02 .JK251217graduation__price.text-left {
  margin-bottom: calc(110 * var(--formula));
  margin-top: 0;
  padding-top: calc(30 * var(--formula));
}
.JK251217graduation__content02--img01 {
  margin-top: calc(-180 * var(--formula));
  padding-top: calc(180 * var(--formula));
  background-color: #fffcf3;
}
.JK251217graduation__content02--img02 {
  width: calc(615 * var(--formula));
  position: relative;
  margin-bottom: calc(50 * var(--formula));
}
.JK251217graduation__content02--img02 a {
  position: relative;
  z-index: 2;
}
.JK251217graduation__content02--img02::before {
  content: "";
  height: calc(815 * var(--formula));
  width: calc(610 * var(--formula));
  display: block;
  position: absolute;
  right: calc(20 * var(--formula));
  top: calc(20 * var(--formula));
  border: 1px solid #17295b;
  z-index: 0;
}
.JK251217graduation__content02 .JK251217graduation__price.text-right {
  margin-right: calc(40 * var(--formula));
  margin-bottom: calc(98 * var(--formula));
}
.JK251217graduation__content02--img03 {
  margin-bottom: calc(105 * var(--formula));
}
.JK251217graduation__content02--img03 .JK251217graduation__about-text__item-img {
  justify-content: center;
  margin: calc(12 * var(--formula)) auto calc(30 * var(--formula));
  gap: calc(10 * var(--formula));
}
.JK251217graduation__content02--img03 .JK251217graduation__about-text__item-img--item {
  width: calc(230 * var(--formula));
}
.JK251217graduation__content02--img03 .JK251217graduation__about-text__item-img--item.margin-fx img {
  margin-left: calc(8 * var(--formula));
}
.JK251217graduation__content02 .JK251217graduation__about-text h4 {
  letter-spacing: 0.05em;
}
.JK251217graduation__content02 .JK251217graduation__about-text p {
  margin: calc(40 * var(--formula)) auto calc(0 * var(--formula));
}
.JK251217graduation__content02--img04 {
  width: calc(660 * var(--formula));
  margin: 0 auto;
}
.JK251217graduation__content02--img04--price.text-left {
  margin-left: calc(43 * var(--formula));
  margin-bottom: 0 !important;
}
.JK251217graduation__content03--bg-white {
  background-color: white;
}
.JK251217graduation__content03--accent {
  padding-bottom: calc(60 * var(--formula));
}
.JK251217graduation__content03--img02 {
  margin-top: calc(115 * var(--formula));
  margin-bottom: calc(36 * var(--formula));
  width: calc(600 * var(--formula));
}
.JK251217graduation__content03 .JK251217graduation__price.text-right {
  margin-right: calc(41 * var(--formula));
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content03 .JK251217graduation__price.text-right {
    margin-bottom: calc(110 * var(--formula));
  }
}
.JK251217graduation__content03--img03 {
  margin-bottom: calc(117 * var(--formula));
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content03--img03 {
    margin-bottom: calc(119 * var(--formula));
  }
}
.JK251217graduation__content03--img03 li {
  width: calc(546 * var(--formula)) !important;
}
.JK251217graduation__content03--img04 {
  width: calc(660 * var(--formula));
}
.JK251217graduation__content03 .JK251217graduation__price.text-left {
  margin-bottom: calc(95 * var(--formula));
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content03 .JK251217graduation__price.text-left {
    margin-bottom: calc(98 * var(--formula));
  }
}
.JK251217graduation__content03--img05 .JK251217graduation__about-text__item-img {
  margin: calc(35 * var(--formula)) calc(40 * var(--formula)) calc(50 * var(--formula));
  gap: calc(0 * var(--formula));
}
.JK251217graduation__content03--img05 .JK251217graduation__about-text__item-img--item {
  width: calc(228 * var(--formula));
}
.JK251217graduation__content03--img05.JK251217graduation__about-text h4 {
  letter-spacing: 0.05em;
}
.JK251217graduation__content03--img05.JK251217graduation__about-text p {
  margin: calc(40 * var(--formula)) auto calc(106 * var(--formula));
}
@media screen and (min-width: 768px) {
  .JK251217graduation__content03--img05.JK251217graduation__about-text p {
    margin: calc(37 * var(--formula)) auto calc(106 * var(--formula));
  }
}
.JK251217graduation__all-item-btn {
  margin: 0 auto;
}
.JK251217graduation__all-item-btn a {
  display: block;
  background-color: #b7825e;
  color: white;
  font-size: calc(32 * var(--formula));
  font-family: "effra", sans-serif;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  width: calc(600 * var(--formula));
  justify-content: center;
  padding: calc(47 * var(--formula)) 0 calc(44 * var(--formula));
  margin: 0 auto calc(120 * var(--formula));
  position: relative;
}
.JK251217graduation__all-item-btn a span {
  display: block;
  margin-left: calc(-40 * var(--formula));
}
.JK251217graduation__all-item-btn a::after {
  content: "";
  background: url("../img/btn-icon.svg");
  background-repeat: no-repeat;
  width: calc(40 * var(--formula));
  height: calc(40 * var(--formula));
  display: block;
  position: absolute;
  right: calc(100 * var(--formula));
  top: calc(40 * var(--formula));
}
.JK251217graduation__footer--accent {
  margin: calc(120 * var(--formula)) auto 0;
  padding-bottom: calc(60 * var(--formula));
}