/*
  Theme Name: theme
  Version: 1.0.0
 */

/* --- フォント --- */

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@import url("https://use.typekit.net/obo1mjz.css");

/* --- コーディング --- */

:is(.-design, .-design-sp) img {
  bottom: 0;
  left: 0;
  object-fit: cover;
  object-position: 0 0;
  opacity: 0.5;
  right: 0;
  top: 0;
  z-index: 100;
}
.-design img {
  position: absolute;
}
.-design-sp img {
  position: fixed;
}

@media not (width = 1440px) {
  .-design img {
    display: none;
  }
}

@media not (width = 375px) {
  .-design-sp img {
    display: none;
  }
}

/* --- 共通 --- */

:root {
  --base-px: 8px;
  --base-width: 1440px;
  --responsive-base-width: 1440px;
  --vw-px: calc(100vw / var(--base-width) * var(--base-px));
  --responsive-vw-px: calc(100vw / var(--responsive-base-width) * var(--base-px));
  --max-px: max(var(--base-px), var(--vw-px));
}

* {
  letter-spacing: 0.04em;
  line-height: 1;
  margin: 0;
}

a {
  text-decoration: none;
  white-space: nowrap;
}

figure {
  height: 100%;
}

img {
  max-height: 100%;
  object-fit: contain;
  width: 100%;
}

.visually-hidden {
  border: 0px;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  overflow-wrap: normal;
  padding: 0px;
  position: absolute;
  width: 1px;
}

@media not (width <= 768.99px) {
  .show-mobile {
    display: none !important;
  }
}
@media (width <= 768.99px) {
  :root {
    --responsive-base-width: 375px;
  }

  * {
    letter-spacing: 0;
  }

  .show-mobile {
    display: inherit;
  }
  .hide-mobile {
    display: none !important;
  }
}

/* --- 高さ --- */

body {
  min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
}
body,
.wp-site-blocks {
  display: flex;
  flex-direction: column;
}
.wp-site-blocks,
.wp-site-blocks > main {
  flex-grow: 1;
}

/* --- WP --- */

.wp-site-blocks {
  position: relative;
}

.wp-block-cover, .wp-block-cover-image {
  min-height: initial;
  padding: 0;
}

/* --- ヘッダー --- */

.site-header {
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
}

.site-header .wp-block-image img {
  height: calc(18.75 * var(--vw-px));
}

.site-header .end {
  padding: calc(4 * var(--vw-px));
}

.site-header .wp-block-button__link {
  align-items: center;
  border-bottom: solid 4px var(--wp--preset--color--button-shadow);
  display: flex;
  font-size: calc(2.5 * var(--vw-px));
  gap: calc(0.75 * var(--vw-px));
  padding: calc(7 * var(--vw-px) * 0.5) calc(8.5 * var(--vw-px) * 0.5);
}

.site-header .wp-block-button__link::before,
.site-header .wp-block-button__link::after {
  font-family: "icon";
  line-height: 0;
}
.site-header .wp-block-button__link::before {
  content: "\e900";
  font-size: calc(2.625 * var(--vw-px));
}

.site-header .wp-block-button__link::after {
  content: "\e901";
  font-size: calc(2 * var(--vw-px));
}

@media (width <= 768.99px) {
  .site-header .wp-block-image img {
    height: calc(15 * min(var(--max-px), var(--responsive-vw-px)));
  }
}

/* --- フッター --- */

.site-footer {
  align-items: center;
  background: var(--wp--preset--color--base-black);
  bottom: var(--10vw);
  display: flex;
  padding: calc(4 * var(--max-px));
}

.site-footer small {
  color: var(--wp--preset--color--base-white);
  font-size: calc(1.75 * var(--responsive-vw-px));
}

/* --- プライバシーポリシー --- */

body.privacy-policy .entry-content {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--max-px));
  padding: calc(20 * var(--responsive-vw-px)) calc(5 * var(--max-px)) calc(5 * var(--max-px));
}

body.privacy-policy .entry-content * {
  line-height: 1.6;
}

@media (width <= 768.99px) {
  body.privacy-policy .entry-content {
    padding: calc(15 * var(--max-px)) calc(2 * var(--max-px)) calc(5 * var(--max-px));
  }
}

/* --- 画像ページ --- */

.page-1, .page-2, .page-3, .page-4, .page-5, .page-6, .page-7 {
  left: calc(-31.755 * var(--vw-px) + var(--head-space-side));
  position: relative;
  width: calc(100% + 31.755 * var(--vw-px) + var(--head-space-side));
}

@media (width <= 768.99px) {
  .page-1, .page-2, .page-3, .page-4, .page-5, .page-6, .page-7 {
    left: calc(-10 * var(--vw-px) + var(--head-space-side));
    width: calc(100% + 20 * var(--vw-px) + var(--head-space-side));
  }
}

/* --- メインヴィジュアル --- */

.content-first-view {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--vw-px));
  padding: calc(23 * var(--vw-px)) 0 calc(26 * var(--vw-px)) calc(21.25 * var(--vw-px));
}

.content-first-view .bg.wp-block-image {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -3;
}

.content-first-view .bg.wp-block-image img {
  object-position: 0 0;
}

.content-first-view .copy.wp-block-image {
  height: auto;
  position: absolute;
  right: calc(14.125 * var(--vw-px));
  top: calc(17.125 * var(--vw-px));
}

.content-first-view .copy.wp-block-image img {
  height: calc(42.5 * var(--vw-px));
}

.content-first-view .area-1 {
  display: flex;
  gap: calc(1.5 * var(--vw-px));
}

.content-first-view .area-1-1 {
  align-items: center;
  color: var(--wp--preset--color--point-blue);
  display: flex;
  gap: calc(1.25 * var(--vw-px));
}

.content-first-view .area-1-1 > span:first-child {
  background: var(--wp--preset--color--point-blue);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 70%, 90% 100%, 30% 100%, 0 100%, 0% 30%);
  color: var(--wp--preset--color--base-white);
  font-size: calc(3 * var(--vw-px));
  padding: calc(1.625 * var(--vw-px) * 0.5) calc(3.75 * var(--vw-px) * 0.5);
}

.content-first-view .area-1-1 > span:not(:first-child) {
  font-size: calc(5 * var(--vw-px));
  font-weight: bold;
}

.content-first-view .area-1 h1 {
  background: var(--wp--preset--gradient--brand-orange);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: calc(5.5 * var(--vw-px));
  letter-spacing: 0.02em;
}

.content-first-view .area-2 {
  gap: calc(3.5 * var(--vw-px));
}

.content-first-view .area-2-1 {
  gap: calc(3.25 * var(--vw-px));
}

.content-first-view .area-2-1-1 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  font-weight: bold;
  gap: calc(1 * var(--vw-px));
}

.content-first-view .area-2-1-1 > span {
  background: var(--wp--preset--color--base-white);
  color: var(--wp--preset--color--point-blue);
  display: inline-block;
  font-size: calc(6.5 * var(--vw-px));
  padding: calc(2.25 * var(--vw-px) * 0.5) calc(5 * var(--vw-px) * 0.5);
}

.content-first-view .area-2-1-2 {
  color: var(--wp--preset--color--base-black);
  display: flex;
  flex-direction: column;
  font-size: calc(2.25 * var(--vw-px));
  gap: calc(1.35 * var(--vw-px));
}

.content-first-view :is(.area-2-2, .area-2-12) {
  gap: calc(4.125 * var(--vw-px));
}

.content-first-view .wp-block-button__link {
  align-items: center;
  border-bottom: solid 4px var(--wp--preset--color--button-shadow);
  display: flex;
  font-size: calc(2.5 * var(--vw-px));
  gap: calc(0.75 * var(--vw-px));
  padding: calc(7 * var(--vw-px) * 0.5) calc(8.5 * var(--vw-px) * 0.5);
}

.content-first-view .wp-block-button__link::before,
.content-first-view .wp-block-button__link::after {
  font-family: "icon";
  line-height: 0;
}
.content-first-view .wp-block-button__link::before {
  content: "\e900";
  font-size: calc(2.625 * var(--vw-px));
}

.content-first-view .wp-block-button__link::after {
  content: "\e901";
  font-size: calc(2 * var(--vw-px));
}

@media (width <= 768.99px) {
  .content-first-view {
    align-items: center;
    gap: calc(2.5 * var(--responsive-vw-px));
    height: auto;
    padding: calc(41.125 * var(--responsive-vw-px)) calc(1.8125 * var(--responsive-vw-px)) calc(27.5 * var(--vw-px)) ;
  }

  .content-first-view .copy.wp-block-image {
    right: calc(2.5 * var(--responsive-vw-px));
    top: calc(3.75 * var(--responsive-vw-px));
  }

  .content-first-view .copy.wp-block-image img {
    height: calc(24 * var(--responsive-vw-px));
  }

  .content-first-view .area-1 {
    gap: calc(1.5 * var(--responsive-vw-px));
  }

  .content-first-view .area-1 h1 {
    font-size: calc(3.625 * var(--responsive-vw-px));
  }

  .content-first-view .area-1-1 > span:first-child {
    font-size: calc(1.625 * var(--responsive-vw-px));
    padding: calc(0.875 * var(--responsive-vw-px) * 0.5) calc(1.875 * var(--responsive-vw-px) * 0.5);
  }

  .content-first-view .area-1-1 > span:not(:first-child) {
    font-size: calc(2.5 * var(--responsive-vw-px));
  }

  .content-first-view .area-2 {
    align-items: center;
    gap: calc(3 * var(--responsive-vw-px));
  }

  .content-first-view .area-2-1 {
    align-items: center;
    gap: calc(2.5 * var(--responsive-vw-px));
  }

  .content-first-view .area-2-1-1 {
    align-items: center;
    gap: calc(0.5 * var(--responsive-vw-px));
  }

  .content-first-view .area-2-1-1 > span {
    font-size: calc(2.5 * var(--responsive-vw-px));
    padding: calc(1 * var(--responsive-vw-px) * 0.5) calc(2.375 * var(--responsive-vw-px) * 0.5);
  }
  .content-first-view .area-2-1-1 > span:first-child {
    font-size: calc(2.75 * var(--responsive-vw-px));
  }

  .content-first-view .area-2-1-2 {
    font-size: calc(1.75 * var(--responsive-vw-px));
    gap: calc(0.7 * var(--responsive-vw-px));
  }

  .content-first-view .wp-block-button__link {
    font-size: calc(2.5 * var(--responsive-vw-px));
    gap: calc(0.75 * var(--responsive-vw-px));
    padding: calc(6.25 * var(--responsive-vw-px) * 0.5) calc(9.75 * var(--responsive-vw-px) * 0.5);
  }

  .content-first-view .wp-block-button__link::before {
    font-size: calc(2.625 * var(--responsive-vw-px));
  }

  .content-first-view .wp-block-button__link::after {
    font-size: calc(2.5 * var(--responsive-vw-px));
  }
}

/* --- 利用者の声 --- */

.content-voice {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(7.875 * var(--responsive-vw-px));
  padding: 0 0 calc(18.125 * var(--vw-px));
}

.content-voice :is(.bg-1, .bg-2).wp-block-image {
  height: auto;
}
.content-voice .bg-1.wp-block-image {
  bottom: 0;
  left: 0;
  position: absolute;
  top: calc(75.875 * var(--vw-px));
  width: 100%;
  z-index: -2;
}

.content-voice .bg-1.wp-block-image img {
  object-fit: cover;
  object-position: 0 0;
}

.content-voice .bg-2.wp-block-image {
  left: calc(44.75 * var(--vw-px));
  position: absolute;
  top: calc(96 * var(--vw-px));
  width: calc(67 * var(--vw-px));
  z-index: -1;
}

.content-voice .bg-2.wp-block-image img {
  mask-image: linear-gradient(180deg, #D9D9D9 75.51%, rgba(115, 115, 115, 0) 100%);
  mask-mode: alpha;
}

.content-voice .area-1 {
  display: flex;
  flex-direction: column;
  gap: calc(4.5 * var(--vw-px));
}

.content-voice .area-1-1 {
  display: flex;
  flex-direction: column;
  gap: calc(0.25 * var(--vw-px));
}

.content-voice .area-1-1 h2 {
  font-size: calc(5.5 * var(--responsive-vw-px));
  letter-spacing: 0;
}

.content-voice .area-1-1 .wp-block-image {
  height: calc(1.625 * var(--responsive-vw-px));
}

.content-voice .area-1-2 {
  align-items: center;
  display: flex;
  font-size: calc(4.5 * var(--max-px));
  gap: calc(3.5 * var(--vw-px));
}

.content-voice .area-1-2 > span:first-child {
  align-items: center;
  background: var(--wp--preset--color--brand-red);
  color: #fff;
  display: flex;
  font-size: calc(2.25 * var(--responsive-vw-px));
  font-weight: bold;
  padding: calc(3.375 * var(--max-px) * 0.5) calc(5 * var(--max-px) * 0.5);
  position: relative;
}

.content-voice .area-1-2 > span:first-child::after {
  background: var(--wp--preset--color--brand-red);
  content: "";
  height: calc(1 * var(--max-px));
  position: absolute;
  right: calc(-0.5 * var(--max-px));
  transform: rotate(-45deg);
  width: calc(1 * var(--max-px));
}

.content-voice .area-2 {
  display: flex;
  flex-wrap: wrap;
  gap: calc(2.5 * var(--responsive-vw-px));
  justify-content: center;
  row-gap: calc(5 * var(--max-px));
}

.content-voice .area-2-voice {
  background: var(--wp--preset--color--point-blue-light);
  box-shadow: 6px 6px 0px #2457A3;
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--vw-px));
  padding: calc(8 * var(--max-px) * 0.5) calc(5 * var(--max-px) * 0.5);
  position: relative;
  width: calc(44.125 * var(--responsive-vw-px));
}
.content-voice .area-2-voice:nth-child(even) {
  background: var(--wp--preset--color--base-white);
}

.content-voice .area-2-voice h3 {
  color: #818181;
  font-size: calc(1.75 * var(--responsive-vw-px));
  order: 3;
}

.content-voice .area-2-voice-result {
  align-items: center;
  background: var(--wp--preset--color--point-blue);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 90%, 90% 100%, 30% 100%, 0 100%, 0 10%);
  display: flex;
  flex-direction: column;
  left: calc(2.5 * var(--vw-px));
  padding: calc(1.375 * var(--max-px)) calc(2.625 * var(--responsive-vw-px) * 0.5) calc(2 * var(--max-px));
  position: absolute;
  top: calc(-2.5 * var(--vw-px));
}

.content-voice .area-2-voice-result > span:first-child {
  border: solid 1px var(--wp--preset--color--base-white);
  color: var(--wp--preset--color--base-white);
  font-size: calc(2 * var(--responsive-vw-px));
  font-weight: bold;
  line-height: 1.6;
  padding: 0 calc(2 * var(--vw-px) * 0.5);
}
.content-voice .area-2-voice-result > span:last-child {
  color: var(--wp--preset--color--point-yellow-light);
  font-size: calc(1.75 * var(--responsive-vw-px));
  font-weight: bold;
}

.content-voice .area-2-voice-result > span:first-child > span{
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-voice .area-2-voice-result > span:last-child > span {
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-voice .area-2-voice-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--vw-px));
}

.content-voice .area-2-voice-content-image {
  height: calc(20 * var(--responsive-vw-px));
  width: calc(20 * var(--responsive-vw-px));
}

.content-voice .area-2-voice-content-text {
  font-size: calc(2.25 * var(--responsive-vw-px));
  letter-spacing: 0.02em;
  line-height: 1.6;
}

.content-voice .area-2-voice-content-text > span {
  background: var(--wp--preset--color--point-yellow-light);
}

@media (width <= 768.99px) {
  .content-voice {
    position: relative;
  }

  .content-voice .bg-1.wp-block-image {
    height: calc(62.22875 * var(--responsive-vw-px));
    top: calc(-14 * var(--responsive-vw-px))
  }

  .content-voice .bg-2.wp-block-image {
    height: calc(50 * var(--responsive-vw-px));
    left: 0;
    opacity: 0.5;
    right: 0;
    top: calc(-5 * var(--responsive-vw-px));
    width: 100%;
  }

  .content-voice .area-1-2 {
    flex-direction: column;
    font-size: calc(2.5 * var(--responsive-vw-px));
    gap: calc(2.5 * var(--responsive-vw-px));
  }

  .content-voice .area-1-2 > span:first-child {
    justify-content: center;
  }

  .content-voice .area-1-2 > span:first-child::after {
    bottom: calc(-0.5 * var(--max-px));
    right: inherit;
  }
}

/* 特徴 */

.content-academy {
  --head-space-side: calc(10.75 * var(--vw-px));
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(7.5 * var(--vw-px));
  padding: calc(11 * var(--vw-px)) var(--head-space-side) calc(10 * var(--vw-px)) 0;
  position: relative;
}

.content-academy::before {
  background: var(--wp--preset--color--point-blue-light);
  content: "";
  height: 100%;
  left: var(--head-space-side);
  position: absolute;
  top: 0;
  width: calc(100% - var(--head-space-side));
  z-index: -2;
}

.content-academy .area-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(4.5 * var(--vw-px));
  padding: 0 0 0 var(--head-space-side);
}

.content-academy .area-1-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(0.25 * var(--vw-px));
}

.content-academy .area-1-1 h2 {
  font-size: calc(5.5 * var(--responsive-vw-px));
  letter-spacing: -0.02em;
  text-align: center;
}

.content-academy .area-1-1 .wp-block-image {
  height: calc(1.625 * var(--responsive-vw-px));
}

.content-academy .area-1-2 {
  align-items: center;
  color: var(--wp--preset--color--point-blue);
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--max-px));
}

.content-academy .area-1-2-1 {
  align-items: center;
  display: flex;
  gap: calc(1.25 * var(--vw-px));
}

.content-academy .area-1-2-1 > span:first-child {
  background: var(--wp--preset--color--point-blue);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 70%, 90% 100%, 30% 100%, 0 100%, 0% 30%);
  color: var(--wp--preset--color--base-white);
  font-size: calc(3 * var(--vw-px));
  padding: calc(1.625 * var(--vw-px) * 0.5) calc(3.625 * var(--vw-px) * 0.5);
}

.content-academy .area-1-2-1 > span:not(:first-child) {
  font-size: calc(5 * var(--vw-px));
  font-weight: bold;
}

.content-academy .area-1-2-2 {
  align-items: center;
  border-bottom: solid 3px var(--wp--preset--color--point-blue);
  color: var(--wp--preset--color--point-blue);
  display: flex;
  font-size: calc(5 * var(--responsive-vw-px));
  font-weight: bold;
  letter-spacing: -0.08em;
  padding: 0 0 calc(1.5 * var(--max-px) * 0.5);
}

.content-academy .area-1-2-2 > span:first-child {
  font-size: calc(8 * var(--vw-px));
}

.content-academy :is(.area-2-wrapper, .area-3-wrapper, .area-4-wrapper).bg {
  position: relative;
  width: 100%;
}

.content-academy :is(.area-2-wrapper, .area-3-wrapper, .area-4-wrapper).bg .wp-block-cover__image-background {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -2;
}

.content-academy :is(.area-2, .area-3, .area-4) {
  display: flex;
  flex-direction: column;
  gap: calc(6 * var(--max-px));
  padding: calc(18 * var(--vw-px)) calc(10.5 * var(--vw-px)) calc(10 * var(--vw-px)) calc(21.25 * var(--vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 {
  align-items: center;
  color: var(--wp--preset--color--point-blue);
  display: flex;
  font-family: var(--wp--preset--font-family--zebrawood-std);
  font-size: calc(10 * var(--responsive-vw-px));
  gap: calc(2.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:first-child {
  align-items: center;
  display: flex;
  opacity: 0.4;
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:first-child > span:first-child {
  border-bottom: solid 1px var(--wp--preset--color--point-blue);
  border-top: solid 1px var(--wp--preset--color--point-blue);
  display: flex;
  flex-direction: column;
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:first-child > span:first-child > span {
  font-size: calc(2.875 * var(--responsive-vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:first-child > span:first-child > span:first-child {
  font-size: calc(2.25 * var(--responsive-vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:first-child > span:first-child > span:last-child {
  font-size: calc(1.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:last-child {
  align-items: center;
  display: flex;
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-2, .area-3, .area-4) h3 > span:last-child > span {
  border: solid 2px var(--wp--preset--color--point-blue);
  padding: calc(0.75 * var(--responsive-vw-px)) calc(0.25 * var(--responsive-vw-px)) 0px;
}
.content-academy :is(.area-2, .area-3, .area-4) h3 > span:last-child > span:not(:last-child) {
  border-right: none;
}

.content-academy :is(.area-2-1, .area-3-1, .area-4-1) {
  display: flex;
  gap: calc(5 * var(--vw-px));
}

.content-academy :is(.area-2-1-1, .area-3-1-1, .area-4-1-1) {
  color: var(--wp--preset--color--point-blue);
  display: flex;
  flex-direction: column;
  font-size: calc(4 * var(--vw-px));
  font-weight: bold;
  gap: calc(2.4 * var(--max-px));
  white-space: nowrap;
}

.content-academy :is(.area-2-1-1, .area-3-1-1, .area-4-1-1) span {
  letter-spacing: 0.08em;
}

.content-academy :is(.area-2-1-1, .area-3-1-1, .area-4-1-1) > span:first-child > span:first-child {
  position: relative;
}

.content-academy :is(.area-2-1-1, .area-3-1-1, .area-4-1-1) > span:first-child > span:first-child::before {
  background: var(--wp--preset--color--point-yellow-light);
  content: "";
  height: calc(100% + calc(0.375 * var(--vw-px)) * 2);
  left: calc(calc(-0.75 * var(--vw-px)));
  position: absolute;
  top: calc(-0.375 * var(--vw-px));
  width: calc(100% + 0.75 * var(--vw-px) * 2);
  z-index: -1;
}

.content-academy :is(.area-2-1-2, .area-3-1-2, .area-4-1-2) {
  font-size: calc(2.25 * var(--vw-px));
  letter-spacing: 0.03em;
  line-height: 1.6;
}

.content-academy :is(.area-2-2, .area-2-12) {
  align-items: center;
  background: var(--wp--preset--color--base-white);
  color: var(--wp--preset--color--point-blue);
  display: flex;
  font-size: calc(4 * var(--vw-px));
  gap: calc(1.25 * var(--vw-px));
  padding: calc(4 * var(--vw-px));
}

.content-academy :is(.area-2-2-wrapper, .area-2-12-wrapper) {
  position: relative;
}

.content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) {
  align-items: center;
  background: var(--wp--preset--color--point-blue-light);
  display: flex;
  flex-direction: column;
  gap: calc(1.5 * var(--vw-px));
  height: calc(19.875 * var(--vw-px));
  justify-content: center;
  width: calc(39.5 * var(--vw-px));
}

.content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) > span:first-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-weight: bold;
  gap: calc(1.5 * var(--responsive-vw-px));
  letter-spacing: 0.08em;
}
.content-academy :is(.area-2-2, .area-2-12) > span:is(.area-2-2-symbol, .area-2-12-symbol)::before {
  font-family: "icon";
}
.content-academy :is(.area-2-2, .area-2-12) > span:is(.area-2-2-symbol, .area-2-12-symbol):nth-child(2)::before {
  content: "\e902";
}
.content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol):nth-child(3) > span:first-child {
  color: var(--wp--preset--color--brand-red);
}
.content-academy :is(.area-2-2, .area-2-12) > span:is(.area-2-2-symbol, .area-2-12-symbol):nth-child(4)::before {
  content: "\e903";
}
.content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol):nth-child(5) > span:first-child {
  color: var(--wp--preset--color--point-green);
}

.content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) > span:not(:first-child) {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(2 * var(--vw-px));
  gap: calc(0.1 * var(--vw-px));
}

.content-academy :is(.area-2-2-center-image, .area-2-12-center-image) {
  height: calc(15 * var(--vw-px));
  left: calc(49.5 * var(--vw-px));
  position: absolute;
  top: calc(-1 * var(--vw-px));
}

.content-academy :is(.area-2-2-right-image, .area-2-12-right-image) {
  bottom: calc(0.625 * var(--vw-px));
  height: calc(7.5 * var(--vw-px));
  position: absolute;
  right: calc(5.275 * var(--vw-px));
}

.content-academy :is(.area-2-3, .area-2-7) {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: calc(4.25 * var(--vw-px));
  padding-top: calc(3.5 * var(--responsive-vw-px))
}

.content-academy :is(.area-2-3, .area-2-7) h4 {
  align-items: center;
  color: var(--wp--preset--color--base-black);
  display: flex;
  font-size: calc(4.5 * var(--vw-px));
  font-weight: inherit;
  padding: calc(0.5 * var(--vw-px) * 0.5) calc(3.5 * var(--vw-px));
  position: relative;
}
.content-academy :is(.area-2-3, .area-2-7) h4,
.content-academy :is(.area-2-3, .area-2-7) h4 span {
  letter-spacing: 0.08em;
}

.content-academy :is(.area-2-3, .area-2-7) h4::before {
  background: var(--wp--preset--color--point-blue);
  content: "";
  height: 100%;
  left: 0;
  opacity: 0.4;
  position: absolute;
  top: 0;
  width: 4px;
}

.content-academy :is(.area-2-3, .area-2-7) h4 > span {
  color: var(--wp--preset--color--brand-red);
  font-size: calc(5 * var(--vw-px));
  font-weight: bold;
}

.content-academy :is(.area-2-3-1, .area-2-7-1) {
  align-items: center;
  display: flex;
  gap: calc(1 * var(--max-px));
}

.content-academy :is(.area-2-3-1, .area-2-7-1) .wp-block-image {
  height: calc(4 * var(--vw-px));
  width: calc(4 * var(--vw-px));
}

.content-academy :is(.area-2-3-1, .area-2-7-1) p {
  color: var(--wp--preset--color--point-blue);
  font-size: calc(3 * var(--vw-px));
}
.content-academy :is(.area-2-3-1, .area-2-7-1) p,
.content-academy :is(.area-2-3-1, .area-2-7-1) p span {
  letter-spacing: 0.08em;
}

.content-academy .area-2-3-1 p span:first-child {
  color: var(--wp--preset--color--brand-red);
}
.content-academy :is(.area-2-3-1, .area-2-7-1) p span:last-child {
  position: relative;
}

.content-academy :is(.area-2-3-1, .area-2-7-1) p span:last-child::before {
  background: var(--wp--preset--color--point-yellow-light);
  content: "";
  height: calc(100% + 0.25 * var(--vw-px) * 2);
  left: calc(-0.25 * var(--vw-px));
  position: absolute;
  top: calc(-0.25 * var(--vw-px));
  width: calc(100% + 0.25 * var(--vw-px) * 2);
  z-index: -1;
}

.content-academy .area-2-4 {
  padding: calc(2.5 * var(--vw-px)) calc(23 * var(--vw-px)) 0 0;
  position: relative;
}

.content-academy .area-2-4 .wp-block-image {
  height: calc(42.5 * var(--vw-px));
}

.content-academy .area-2-4-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(3 * var(--vw-px));
  font-weight: bold;
  gap: calc(0.9 * var(--vw-px));
  left: calc(52 * var(--vw-px));
  top: calc(19.5 * var(--vw-px));
}
.content-academy :is(.area-2-4-1, .area-2-4-2, .area-2-4-3, .area-2-4-4) {
  position: absolute;
}

.content-academy .area-2-4-2 {
  left: calc(17.5 * var(--vw-px));
  top: calc(1 * var(--vw-px));
}
.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) {
  display: flex;
  flex-direction: column;
  gap: calc(2.5 * var(--vw-px));
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child {
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--vw-px));
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span {
  font-size: calc(3 * var(--vw-px));
  letter-spacing: 0.08em;
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span:last-child {
  align-items: flex-end;
  display: flex;
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span:last-child > span:first-child {
  font-size: calc(5 * var(--vw-px));
  letter-spacing: 0.08em;
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) {
  display: flex;
  flex-direction: column;
  gap: calc(1.5 * var(--vw-px));
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:first-child {
  display: flex;
  flex-direction: column;
  font-size: calc(2 * var(--vw-px));
  gap: calc(1 * var(--vw-px));
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:last-child {
  align-items: flex-start;
  display: flex;
  font-size: calc(2 * var(--vw-px));
  font-weight: bold;
}

.content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:last-child > span:last-child {
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--vw-px));
}

.content-academy .area-2-4-3 {
  left: calc(8 * var(--vw-px));
  top: calc(23 * var(--vw-px));
}

.content-academy .area-2-4-3 > span:nth-child(2) > span:last-child {
  color: var(--wp--preset--color--point-blue);
}

.content-academy .area-2-4-4 {
  right: calc(8 * var(--vw-px));
  top: calc(23.25 * var(--vw-px));
}

.content-academy .area-2-4-4 > span:first-child > span:first-child {
  color: var(--wp--preset--color--point-orange);
}

.content-academy .area-2-4-4 > span:nth-child(2) > span:last-child {
  color: var(--wp--preset--color--point-orange);
}

.content-academy :is(.area-2-5-wrapper, .area-2-9-wrapper) {
  padding: calc(2.75 * var(--responsive-vw-px)) 0 0;
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) {
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  padding: calc(5 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px)) calc(4 * var(--responsive-vw-px));
  position: relative;
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) h5 {
  background: var(--wp--preset--color--point-blue);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 70%, 90% 100%, 30% 100%, 0 100%, 0% 30%);
  color: var(--wp--preset--color--base-white);
  font-size: calc(2 * var(--responsive-vw-px));
  left: calc(4 * var(--vw-px));
  padding: calc(3 * var(--responsive-vw-px) * 0.5) calc(5 * var(--responsive-vw-px) * 0.5);
  position: absolute;
  top: calc(-2.75 * var(--responsive-vw-px));
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
  padding: 0 0 0 calc(4 * var(--vw-px));
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul li {
  font-size: calc(2.25 * var(--vw-px));
  padding: 0 0 0 calc(1 * var(--vw-px));
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul li::marker {
  color: var(--wp--preset--color--point-blue);
  content: "\e904";
  font-family: "icon";
  font-size: calc(1.5 * var(--vw-px));
}

.content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul li > span {
  background: var(--wp--preset--color--point-yellow-light);
}

.content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) {
  position: relative;
}

.content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) h5 {
  align-items: center;
  background: var(--wp--preset--color--point-blue-light);
  border-bottom-left-radius: calc(6 * var(--responsive-vw-px));
  border-top-left-radius: calc(6 * var(--responsive-vw-px));
  box-shadow: 4px 4px 0px #2457A3;
  display: flex;
  font-size: calc(3 * var(--responsive-vw-px));
  gap: calc(1.5 * var(--responsive-vw-px));
  left: calc(4 * var(--vw-px));
  padding: 0 calc(2.5 * var(--responsive-vw-px)) 0 0;
  position: absolute;
  top: calc(-2.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) h5 > span:first-child {
  background: var(--wp--preset--color--black);
  border-radius: 100%;
  color: var(--wp--preset--color--base-white);
  font-size: calc(2.75 * var(--responsive-vw-px));
  padding: calc(1 * var(--responsive-vw-px)) calc(1.25 * var(--responsive-vw-px)) calc(1.25 * var(--responsive-vw-px));
}

.content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) p {
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  display: flex;
  flex-direction: column;
  font-size: calc(2.25 * var(--responsive-vw-px));
  gap: calc(1.375 * var(--responsive-vw-px));
  padding: calc(5.625 * var(--responsive-vw-px)) calc(4 * var(--vw-px)) calc(5 * var(--responsive-vw-px));
}

.content-academy .area-2-7 {
  padding: calc(2.5 * var(--vw-px)) 0 0;
}

.content-academy .area-2-7 h4 > span {
  color: var(--wp--preset--color--point-green);
}

.content-academy .area-2-8 {
  display: flex;
  gap: calc(8.875 * var(--vw-px));
  padding: calc(1.5 * var(--vw-px)) 0 0;
}

.content-academy .area-2-8-1 {
  flex-grow: 1;
  padding: calc(0.5 * var(--vw-px)) 0 0 calc(1 * var(--vw-px));
  position: relative;
}

.content-academy .area-2-8-1 .wp-block-image {
  height: calc(42.5 * var(--vw-px));
}

.content-academy :is(.area-2-8-1-1, .area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4, .area-2-8-1-5) {
  position: absolute;
}

.content-academy .area-2-8-1-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(3.125 * var(--vw-px));
  gap: calc(1 * var(--vw-px));
  left: calc(45 * var(--vw-px));
  top: calc(17 * var(--vw-px));
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) {
  display: flex;
  flex-direction: column;
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:first-child {
  font-size: calc(3 * var(--vw-px));
  font-weight: bold;
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:first-child > span {
  color: var(--wp--preset--color--brand-red);
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:nth-child(2) {
  font-size: calc(1.75 * var(--vw-px));
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:last-child {
  align-items: flex-end;
  display: flex;
  font-size: calc(5 * var(--vw-px));
  gap: calc(0.25 * var(--vw-px));
  letter-spacing: 0.04em;
}

.content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:last-child > span {
  font-size: calc(3 * var(--vw-px));
}

.content-academy .area-2-8-1-2 {
  right: calc(14.25 * var(--vw-px));
  top: calc(-0.5 * var(--vw-px));
}

.content-academy .area-2-8-1-3 {
  right: calc(1.5 * var(--vw-px));
  top: calc(21.25 * var(--vw-px));
}

.content-academy .area-2-8-1-4 {
  left: calc(0.25 * var(--vw-px));
  top: calc(21.5 * var(--vw-px));
}

.content-academy .area-2-8-1-5 {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(1.5 * var(--vw-px));
  gap: calc(0.5 * var(--vw-px));
  left: calc(37 * var(--vw-px));
  position: absolute;
  top: calc(44.75 * var(--vw-px));
}

.content-academy .area-2-8-1-5 > span {
  letter-spacing: 0.08em;
}

.content-academy .area-2-8-2 {
  display: flex;
  flex-direction: column;
  gap: calc(1.5 * var(--responsive-vw-px));;
}

.content-academy :is(.area-2-8-2-1, .area-2-8-2-2) {
  align-items: center;
  border-radius: calc(1.5 * var(--responsive-vw-px));
  display: flex;
  flex-direction: column;
  padding: calc(2 * var(--responsive-vw-px)) calc(0.8 * var(--responsive-vw-px));
}

.content-academy :is(.area-2-8-2-1, .area-2-8-2-2) > :is(h5, p) {
  display: flex;
  flex-direction: column;
}

.content-academy :is(.area-2-8-2-1, .area-2-8-2-2) > h5 {
  align-items: center;
  font-size: calc(2.25 * var(--responsive-vw-px));
  gap: calc(1 * var(--responsive-vw-px));
}

.content-academy :is(.area-2-8-2-1, .area-2-8-2-2) > p {
  font-size: calc(2.5 * var(--responsive-vw-px));
  gap: calc(1 * var(--responsive-vw-px));
  padding: calc(3.5 * var(--responsive-vw-px)) 0 0;
}

.content-academy .area-2-8-2-1 {
  background: var(--wp--preset--color--point-blue);
  color: var(--wp--preset--color--base-white);
}

.content-academy .area-2-8-2-2 {
  background: var(--wp--preset--color--point-yellow);
  color: var(--wp--preset--color--point-blue);
}

.content-academy .area-2-8-2-2 > p:not(:last-child) {
  gap: calc(2.25 * var(--responsive-vw-px));
}

.content-academy .area-2-8-2-2 > p:last-child {
  align-items: center;
  color: var(--wp--preset--color--base-black);
  font-size: calc(1.75 * var(--responsive-vw-px));
  gap: calc(0.75 * var(--responsive-vw-px));
  padding: calc(1 * var(--responsive-vw-px));
}

.content-academy .area-2-9-wrapper {
  padding: 0;
}

.content-academy .area-2-10 p > span > span {
  background: var(--wp--preset--color--point-yellow-light);
}

.content-academy .area-2-11 h4 {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(4.25 * var(--responsive-vw-px));
  gap: calc(1.5 * var(--responsive-vw-px));
}

.content-academy .area-2-11 h4 > span:first-child > span {
  font-family: var(--wp--preset--font-family--zebrawood-std);
}

.content-academy .area-2-11 h4 span:last-child,
.content-academy .area-2-11 h4 span:last-child span {
  letter-spacing: 0;
  line-height: 1.4;
}

.content-academy .area-2-11 h4 span:last-child > span {
  color: var(--wp--preset--color--brand-red)
}

.content-academy .area-2-12-wrapper {
  padding: calc(1.5 * var(--responsive-vw-px)) 0 0;
}

.content-academy .area-2-12 {
  color: var(--wp--preset--color--base-black);
}

.content-academy :is(.area-2-2, .area-2-12) > span:first-child {
  color: var(--wp--preset--color--brand-red);
}

.content-academy .area-2-12-symbol {
  color: var(--wp--preset--color--brand-red);
}

.content-academy .area-2-12-center-image-2 {
  height: calc(6.75 * var(--responsive-vw-px));
  left: calc(81.25 * var(--vw-px));
  position: absolute;
  top: calc(3.25 * var(--vw-px));
}

.content-academy .area-2-12-right-image-2 {
  bottom: calc(7.25 * var(--vw-px));
  height: calc(6.75 * var(--responsive-vw-px));
  position: absolute;
  right: calc(4.25 * var(--vw-px));
}

.content-academy :is(.area-3-2, .area-3-3) {
  display: flex;
  gap: calc(15 * var(--vw-px));
  padding: calc(7 * var(--responsive-vw-px)) 0;
  position: relative;
}

.content-academy :is(.area-3-2-image, .area-3-3-image) {
  height: calc(80 * var(--responsive-vw-px));
}

.content-academy :is(.area-3-2-image-2, .area-3-3-image-2) {
  height: calc(21 * var(--responsive-vw-px));
  left: calc(20 * var(--vw-px));
  position: absolute;
  top: calc(-5.25 * var(--responsive-vw-px));
}

.content-academy :is(.area-3-2-1, .area-3-3-1) {
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--responsive-vw-px));
}

.content-academy .area-3-2-1-3 {
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  padding: calc(5 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px)) calc(4 * var(--responsive-vw-px));
  position: relative;
}

.content-academy .area-3-2-1-3 h5 {
  background: #29B183;
  color: var(--wp--preset--color--base-white);
  font-size: calc(2.25 * var(--responsive-vw-px));
  left: calc(4 * var(--vw-px));
  padding: calc(3 * var(--responsive-vw-px) * 0.5);
  position: absolute;
  top: calc(-2.75 * var(--responsive-vw-px));
}

.content-academy .area-3-2-1-3 ul {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
  padding: 0 0 0 calc(4 * var(--vw-px));
}

.content-academy .area-3-2-1-3 ul li {
  font-size: calc(2.25 * var(--vw-px));
  padding: 0 0 0 calc(1 * var(--vw-px));
}

.content-academy .area-3-2-1-3 ul li::marker {
  color: #29B183;
  content: "\e905";
  font-family: "icon";
  font-size: calc(1.5 * var(--vw-px));
}

.content-academy .area-3-3 {
  flex-direction: row-reverse;
  justify-content: flex-end;
}

.content-academy .area-3-3-image-2 {
  right: calc(-4 * var(--vw-px));
}

.content-academy .area-3-3-1-1 h5 {
  font-size: calc(2.5 * var(--responsive-vw-px));
  left: 0;;
  line-height: 1.4;
}

.content-academy .area-4-2 {
  display: flex;
  gap: calc(5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-2-1, .area-4-2-2) {
  align-items: center;
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--responsive-vw-px));
  padding: calc(5 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px)) calc(4 * var(--responsive-vw-px));
  position: relative;
}

.content-academy :is(.area-4-2-1, .area-4-2-2) h4 {
  align-items: center;
  color: var(--wp--preset--color--base-white);
  display: flex;
  font-size: calc(3 * var(--responsive-vw-px));
  gap: calc(1 * var(--responsive-vw-px));
  padding: calc(1.625 * var(--responsive-vw-px) * 0.5) calc(3.625 * var(--responsive-vw-px) * 0.5);
  position: absolute;
  top: calc(-2.75 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-2-1, .area-4-2-2) h4 span {
  border: solid 1px var(--wp--preset--color--base-white);
  padding: calc(0.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-2-1, .area-4-2-2) p {
  font-size: calc(2 * var(--responsive-vw-px));
  line-height: 1.4;
}

.content-academy .area-4-2-1 h4 {
  background: #505050;
}

.content-academy .area-4-2-2 h4 {
  background: #29B183;
}

.content-academy :is(.area-4-2-1, .area-4-2-2) .wp-block-image {
  height: calc(15.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1, .area-4-3-2, .area-4-3-3) {
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1, .area-4-3-2, .area-4-3-3) h4 {
  align-items: center;
  border-left: solid 4px var(--wp--preset--color--point-blue);
  display: flex;
  font-size: calc(3 * var(--responsive-vw-px));
  line-height: 1.4;
}

.content-academy :is(.area-4-3-1, .area-4-3-2, .area-4-3-3) h4 > span:first-child {
  color: var(--wp--preset--color--point-blue);
  font-size: calc(2.5 * var(--responsive-vw-px));
  line-height: 1.4;
  padding: calc(1.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1-1, .area-4-3-2-1, .area-4-3-3-1) {
  display: flex;
  gap: calc(1 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1-1-1, .area-4-3-1-1-2, .area-4-3-1-1-3, .area-4-3-2-1-1, .area-4-3-2-1-2, .area-4-3-2-1-3, .area-4-3-3-1-1, .area-4-3-3-1-2, .area-4-3-3-1-3) {
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  padding: calc(4 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px));
  position: relative;
  width: calc(42.5 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1-1-1, .area-4-3-1-1-2, .area-4-3-1-1-3, .area-4-3-2-1-1, .area-4-3-2-1-2, .area-4-3-2-1-3, .area-4-3-3-1-1, .area-4-3-3-1-2, .area-4-3-3-1-3) h5 {
  background: var(--wp--preset--color--point-blue);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 70%, 90% 100%, 30% 100%, 0 100%, 0% 30%);
  color: var(--wp--preset--color--base-white);
  font-size: calc(3 * var(--responsive-vw-px));
  left: calc(4 * var(--vw-px));
  padding: calc(3 * var(--responsive-vw-px) * 0.5) calc(5 * var(--responsive-vw-px) * 0.5);
  position: absolute;
  top: calc(-2.75 * var(--responsive-vw-px));
}

.content-academy :is(.area-4-3-1-1-1, .area-4-3-1-1-2, .area-4-3-1-1-3, .area-4-3-2-1-1, .area-4-3-2-1-2, .area-4-3-2-1-3, .area-4-3-3-1-1, .area-4-3-3-1-2, .area-4-3-3-1-3) p {
  line-height: 1.6;
}

.content-academy :is(.area-4-3-1-1-1, .area-4-3-1-1-2, .area-4-3-1-1-3, .area-4-3-2-1-1, .area-4-3-2-1-2, .area-4-3-2-1-3, .area-4-3-3-1-1, .area-4-3-3-1-2, .area-4-3-3-1-3) p span {
  background: var(--wp--preset--color--point-yellow-light);
}

.content-academy .area-4-3 {
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--responsive-vw-px));
}

.content-academy .area-4-4 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--responsive-vw-px));
  padding: 0 0 calc(4 * var(--responsive-vw-px));
  position: relative;
}

.content-academy .area-4-4-bg {
  bottom: 0;
  height: calc(29.25 * var(--responsive-vw-px));
  position: absolute;
  z-index: -1;
}

.content-academy .area-4-4 h4 {
  background: #29B183;
  color: var(--wp--preset--color--base-white);
  font-size: calc(3 * var(--responsive-vw-px));
  padding: calc(2 * var(--responsive-vw-px)) calc(5 * var(--responsive-vw-px));
}

.content-academy .area-4-4-1 {
  display: flex;
}

.content-academy .area-4-4-1 .wp-block-image {
  height: calc(18.5 * var(--responsive-vw-px));
}

.content-academy .area-4-4-1 ul {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
  padding: 0 0 0 calc(4 * var(--vw-px));
}

.content-academy .area-4-4-1 ul li {
  font-size: calc(2.25 * var(--vw-px));
  padding: 0 0 0 calc(1 * var(--vw-px));
}

.content-academy .area-4-4-1 ul li::marker {
  color: #29B183;
  content: "\e905";
  font-family: "icon";
  font-size: calc(1.5 * var(--vw-px));
}

@media (width <= 768.99px) {
  .content-academy {
    --head-space-side: 0px;
  }

  .content-academy::before {
    --head-space-side: calc(2 * var(--responsive-vw-px));
  }

  .content-academy .area-1-2-1 > span:first-child {
    font-size: calc(1.625 * var(--responsive-vw-px));
    padding: calc(0.875 * var(--responsive-vw-px) * 0.5) calc(1.875 * var(--responsive-vw-px) * 0.5);
  }
  .content-academy .area-1-2-1 > span:not(:first-child) {
    font-size: calc(2.5 * var(--responsive-vw-px));
  }

  .content-academy .area-1-2-2 {
    font-size: calc(3 * var(--responsive-vw-px));
  }

  .content-academy .area-1-2-2 > span:first-child {
    font-size: calc(4 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2, .area-3, .area-4) {
    gap: calc(4 * var(--responsive-vw-px));
    padding: calc(4 * var(--responsive-vw-px)) calc(2.5 * var(--responsive-vw-px)) calc(2.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-1, .area-3-1, .area-4-1) {
    flex-direction: column;
  }

  .content-academy :is(.area-2-1-1, .area-3-1-1, .area-4-1-1) {
    font-size: calc(2.5 * var(--responsive-vw-px));
    gap: calc(1.4 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-1-2, .area-3-1-2, .area-4-1-2) {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-2, .area-2-12) {
    flex-direction: column;
    gap: calc(1.5 * var(--responsive-vw-px));
    padding: calc(2 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px)) calc(7.25 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-2, .area-2-12) > span:is(.area-2-2-symbol, .area-2-12-symbol) {
    font-size: calc(2.5 * var(--responsive-vw-px));
    transform: rotate(90deg);
  }
  .content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) {
    --box-space-y: calc(4 * var(--responsive-vw-px));
    --box-space-x: calc(2 * var(--responsive-vw-px));
    gap: calc(2 * var(--responsive-vw-px));
    height: auto;
    min-height: calc(12.5 * var(--responsive-vw-px) - var(--box-space-y) * 2);
    padding: var(--box-space-y) var(--box-space-x);
    width: calc(100% - var(--box-space-x) * 2);
  }

  .content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) > span:first-child {
    font-size: calc(3 * var(--responsive-vw-px));
  }
  .content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol) > span:not(:first-child) {
    color: var(--wp--preset--color--base-black);
    font-size: calc(2 * var(--responsive-vw-px));
    gap: calc(0.4 * var(--responsive-vw-px));
  }
  .content-academy :is(.area-2-2, .area-2-12) > span:is(.area-2-2-symbol, .area-2-12-symbol):nth-child(4) {
    font-size: calc(2 * var(--responsive-vw-px));
    font-weight: bold;
  }

  .content-academy :is(.area-2-2, .area-2-12) > span:not(.area-2-2-symbol, .area-2-12-symbol)  > span:not(:first-child) > span {
    letter-spacing: 0.04em;
  }

  .content-academy :is(.area-2-2-center-image, .area-2-12-center-image) {
    height: calc(15 * var(--responsive-vw-px));
    left: calc(2.5 * var(--responsive-vw-px));
    top: calc(20.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-2-right-image, .area-2-12-right-image) {
    bottom: calc(2 * var(--responsive-vw-px));
    height: calc(7.5 * var(--responsive-vw-px));
    right: calc(3.275 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-3, .area-2-7) {
    gap: calc(3 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-3, .area-2-7) h4 {
    align-items: flex-start;
    flex-direction: column;
    font-size: calc(2.5 * var(--responsive-vw-px));
    gap: calc(1 * var(--responsive-vw-px));
    padding: calc(0.5 * var(--vw-px) * 0.5) calc(5 * var(--vw-px));
  }

  .content-academy :is(.area-2-3, .area-2-7) h4 > span {
    font-size: calc(3 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-3-1, .area-2-7-1) {
    align-items: flex-start;
  }

  .content-academy :is(.area-2-3-1, .area-2-7-1) .wp-block-image {
    height: calc(2.5 * var(--responsive-vw-px));
    width: calc(2.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-3-1, .area-2-7-1) p {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    font-size: calc(2 * var(--responsive-vw-px));
    gap: calc(0.5 * var(--responsive-vw-px));
  }

  .content-academy .area-2-3-1 p span:first-child {
    display: contents;
  }

  .content-academy .area-2-4 {
    height: calc(52 * var(--responsive-vw-px));
    padding:  calc(6 * var(--responsive-vw-px)) 0 0;
  }

  .content-academy .area-2-4 .wp-block-image {
    height: calc(25.75 * var(--responsive-vw-px));
    left: calc(3.75 * var(--responsive-vw-px));
    position: absolute;
  }

  .content-academy .area-2-4-1 {
    font-size: calc(1.875 * var(--responsive-vw-px));
    left: calc(16.375 * var(--responsive-vw-px));
    top: calc(15 * var(--responsive-vw-px));
  }

  .content-academy .area-2-4-2 {
    left: calc(3.875 * var(--responsive-vw-px));
    top: calc(-0.25 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) {
    gap: calc(1 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child {
    gap: calc(0.7 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span {
    font-size: calc(1.75 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span:last-child {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:first-child > span:last-child > span:first-child {
    font-size: calc(2.25 * var(--responsive-vw-px));
    letter-spacing: 0.14em;
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) {
    gap: calc(0.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:first-child {
    width: calc(16.25 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:first-child > span:first-child {
    font-size: calc(1.75 * var(--responsive-vw-px));
    letter-spacing: -0.06em;
    line-height: 1.2;
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:first-child > span:last-child {
    font-size: calc(1.625 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:last-child {
    font-size: calc(1.75 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:last-child > span:last-child {
    gap: calc(0.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-4-2, .area-2-4-3, .area-2-4-4) > span:nth-child(2) > span:last-child > span:last-child > span {
    letter-spacing: -0.06em;
  }

  .content-academy .area-2-4-3 {
    left: 0;
    top: calc(24.125 * var(--responsive-vw-px));
  }

  .content-academy .area-2-4-4 {
    right: 0;
    top:  calc(33 * var(--responsive-vw-px));
  }

  .content-academy .area-2-4-4 > span:nth-child(2) > span:first-child {
    width: calc(16.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) {
    padding: calc(4 * var(--responsive-vw-px)) calc(2.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul {
    padding: 0 0 0 calc(1.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul li {
    font-size: calc(1.75 * var(--responsive-vw-px));
    line-height: 1.5;
  }

  .content-academy :is(.area-2-5, .area-2-9, .area-3-2-1-2, .area-3-3-1-2) ul li::marker {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) {
    padding: calc(3 * var(--responsive-vw-px)) 0;
  }

  .content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) h5 {
    font-size: calc(2.25 * var(--responsive-vw-px));
    top: calc(0.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) p {
    font-size: calc(1.75 * var(--responsive-vw-px));
    padding: calc(5 * var(--responsive-vw-px)) calc(4 * var(--vw-px)) calc(4 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-6, .area-2-10, .area-3-2-1-1, .area-3-3-1-1) p span {
    line-height: 1.5;
  }

  .content-academy .area-2-8 {
    flex-direction: column;
    padding: 0 0 calc(4 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1 {
    height: calc(40.5 * var(--responsive-vw-px));
    padding: 0;
  }

  .content-academy .area-2-8-1 .wp-block-image {
    height: calc(24 * var(--responsive-vw-px));
    left: calc(4 * var(--responsive-vw-px));
    position: absolute;
    top: calc(7 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-1 {
    font-size: calc(1.75 * var(--responsive-vw-px));
    gap: calc(0.5 * var(--responsive-vw-px));
    left: calc(17.5 * var(--responsive-vw-px));
    top: calc(16.5 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-1 {
    font-size: calc(1.75 * var(--responsive-vw-px));
    left: calc(17.5 * var(--responsive-vw-px));
    top: calc(16.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) {
    gap: calc(0.25 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:first-child {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:nth-child(2) {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:last-child {
    font-size: calc(2.75 * var(--responsive-vw-px));
    letter-spacing: 0;
  }

  .content-academy :is(.area-2-8-1-2, .area-2-8-1-3, .area-2-8-1-4) > span:last-child > span {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-2 {
    left: calc(9.75 * var(--responsive-vw-px));
    top: calc(-1.75 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-3 {
    right: 0;
    top: calc(26.75 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-4 {
    top: calc(24.5 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-1-5 {
    font-size: calc(1.5 * var(--responsive-vw-px));
    gap: calc(1 * var(--responsive-vw-px));
    left: calc(6.5 * var(--responsive-vw-px));
    top: calc(35 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-2 {
    flex-direction: row;
  }

  .content-academy :is(.area-2-8-2-1, .area-2-8-2-2) {
    padding: calc(1.75 * var(--responsive-vw-px)) calc(1.35 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-2-8-2-1, .area-2-8-2-2) > h5 {
    flex-direction: row;
    font-size: calc(2 * var(--responsive-vw-px));
    gap: 0;
  }

  .content-academy .area-2-8-2-1 {
    padding-bottom: calc(6 * var(--responsive-vw-px));
  }

  .content-academy .area-2-8-2-2 > p:last-child {
    font-size: calc(1.5 * var(--responsive-vw-px));
  }

  .content-academy .area-2-11 h4 {
    align-items: flex-start;
    font-size: calc(2.875 * var(--responsive-vw-px));
    gap: calc(1 * var(--responsive-vw-px));
  }

  .content-academy .area-2-12-center-image-2 {
    left: calc(36 * var(--responsive-vw-px));
    top: calc(22.5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-3-2, .area-3-3) {
    flex-direction: column;
  }

  .content-academy :is(.area-3-2-image, .area-3-3-image) {
    height: calc(60 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-3-2-image-2, .area-3-3-image-2) {
    left: calc(18.75 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-3-2-1, .area-3-3-1) {
    gap: calc(5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-3-2-1-1, .area-3-3-1-1) {
    padding: calc(3 * var(--responsive-vw-px)) 0 0;
  }

  .content-academy .area-3-2-1-3 {
    padding: calc(5 * var(--responsive-vw-px)) calc(3 * var(--responsive-vw-px));
  }

  .content-academy .area-3-2-1-3 ul {
    padding: 0 0 0 calc(1.5 * var(--responsive-vw-px));
  }

  .content-academy .area-3-2-1-3 ul li {
    font-size: calc(1.75 * var(--responsive-vw-px));
    line-height: 1.5;
  }

  .content-academy .area-3-2-1-3 ul li::marker {
    font-size: calc(1.75 * var(--responsive-vw-px));
  }

  .content-academy .area-3-3-1-1 p {
    padding: calc(8 * var(--responsive-vw-px)) calc(4 * var(--vw-px)) calc(4 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-4-2, .area-4-3) {
    flex-direction: column;
  }

  .content-academy :is(.area-4-2-1, .area-4-2-2) h4 {
    font-size: calc(2 * var(--responsive-vw-px));
    padding: calc(2.5 * var(--responsive-vw-px) * 0.5) calc(4 * var(--responsive-vw-px) * 0.5);
  }

  .content-academy :is(.area-4-2-1, .area-4-2-2) .wp-block-image {
    height: calc(11 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-4-3-1, .area-4-3-2, .area-4-3-3) h4 {
    align-items: flex-start;
    flex-direction: column;
    padding: calc(1 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-4-3-1-1, .area-4-3-2-1, .area-4-3-3-1) {
    flex-direction: column;
    gap: calc(5 * var(--responsive-vw-px));
  }

  .content-academy :is(.area-4-3-1-1-1, .area-4-3-1-1-2, .area-4-3-1-1-3, .area-4-3-2-1-1, .area-4-3-2-1-2, .area-4-3-2-1-3, .area-4-3-3-1-1, .area-4-3-3-1-2, .area-4-3-3-1-3) h5 {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4 {
    gap: calc(2 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4-bg {
    height: calc(58 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4 h4 {
    font-size: calc(2.25 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4-bg img {
    height: 100%;
    object-fit: fill;
  }

  .content-academy .area-4-4-1 {
    flex-direction: column;
    gap: calc(1 * var(--responsive-vw-px));
    padding: calc(1 * var(--responsive-vw-px)) calc(3 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4-1 ul {
    padding: 0 0 0 calc(1.5 * var(--responsive-vw-px));
  }

  .content-academy .area-4-4-1 ul li {
    font-size: calc(1.75 * var(--responsive-vw-px));
    line-height: 1.5;
  }

  .content-academy .area-4-4-1 ul li::marker {
    font-size: calc(1.75 * var(--responsive-vw-px));
  }
}

/* --- フロー --- */

.content-flow {
  --bk-space-side: calc(25 * var(--responsive-vw-px));
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(3 * var(--responsive-vw-px));
  padding: calc(10 * var(--responsive-vw-px)) calc(5 * var(--vw-px));
  position: relative;
}

.content-flow::before {
  background: var(--wp--preset--color--point-blue-light);
  content: "";
  height: calc(47 * var(--responsive-vw-px));
  position: absolute;
  right: var(--bk-space-side);
  top: calc(40 * var(--responsive-vw-px));
  width: calc(100% - var(--bk-space-side));
  z-index: -2;
}

.content-flow > .wp-block-image {
  position: absolute;
  right: 0;
  top: calc(30 * var(--responsive-vw-px));
  width: calc(100% - var(--bk-space-side));
}

.content-flow .area-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(0.25 * var(--vw-px));
}

.content-flow .area-1 h2 {
  font-size: calc(5.5 * var(--responsive-vw-px));
  letter-spacing: -0.02em;
  text-align: center;
}

.content-flow .area-1 .wp-block-image {
  height: calc(1.625 * var(--responsive-vw-px));
}

.content-flow > p {
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-flow .area-2 {
  display: flex;
  gap: calc(2 * var(--responsive-vw-px));
  padding: calc(12 * var(--vw-px)) 0 0;
  position: relative;
}

.content-flow :is(.area-2-1, .area-2-2, .area-2-3) {
  align-items: center;
  background: var(--wp--preset--color--base-white);
  border-bottom-left-radius: calc(1.5 * var(--responsive-vw-px));
  border-top-right-radius: calc(1.5 * var(--responsive-vw-px));
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--responsive-vw-px));
  padding: calc(14 * var(--responsive-vw-px)) calc(2.5 * var(--responsive-vw-px)) calc(4 * var(--responsive-vw-px));
  position: relative;
  width: calc(42.5 * var(--responsive-vw-px) - calc(2.5 * var(--responsive-vw-px)) * 2);
}

.content-flow :is(.area-2-1, .area-2-2, .area-2-3) .wp-block-image {
  height: calc(12.5 * var(--responsive-vw-px));
  position: absolute;
  top: 0;
}

.content-flow :is(.area-2-1, .area-2-2, .area-2-3) h3 {
  align-items: center;
  color: var(--wp--preset--color--point-blue);
  display: flex;
  flex-direction: column;
  font-size: calc(2.5 * var(--responsive-vw-px));
  gap: calc(0.5 * var(--responsive-vw-px));
}

.content-flow :is(.area-2-1, .area-2-2, .area-2-3) h3 > span:first-child {
  font-size: calc(2 * var(--responsive-vw-px));
}

.content-flow :is(.area-2-1, .area-2-2, .area-2-3) > p {
  line-height: 1.4;
}

@media (width <= 768.99px) {
  .content-flow {
    --bk-space-side: calc(2 * var(--responsive-vw-px));
    padding: calc(10 * var(--responsive-vw-px)) calc(5 * var(--vw-px)) calc(10 * var(--responsive-vw-px));
  }

  .content-flow::before {
    height: calc(100 * var(--responsive-vw-px));
    top: calc(35 * var(--responsive-vw-px));
  }

  .content-flow > .wp-block-image {
    display: none;
  }

  .content-flow .area-2 {
    flex-direction: column;
  }

  .content-flow :is(.area-2-1, .area-2-2, .area-2-3) {
    gap: calc(2 * var(--responsive-vw-px));
  }
}

/* --- コーチイントロダクション --- */

.content-introduction {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(3 * var(--responsive-vw-px));
  padding: calc(14 * var(--responsive-vw-px)) calc(10 * var(--vw-px)) 0;
  position: relative;
}

.content-introduction .area-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(0.25 * var(--vw-px));
}

.content-introduction .area-1 h2 {
  font-size: calc(4 * var(--responsive-vw-px));
  letter-spacing: -0.02em;
  padding: 0  calc(0.25 * var(--responsive-vw-px));
  text-align: center;
}

.content-introduction .area-1 .wp-block-image {
  height: calc(1.625 * var(--responsive-vw-px));
}

.content-introduction > p {
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-introduction .area-2 {
  display: flex;
  gap: calc(4 * var(--responsive-vw-px));
}

.content-introduction .area-2-1 {
  position: relative;
}

.content-introduction .area-2-1 > p {
  background: var(--wp--preset--color--base-white);
  bottom: calc(-4.5 * var(--responsive-vw-px));
  box-shadow: 6px 6px 0px #2457A3;
  display: flex;
  flex-direction: column;
  left: calc(-4.5 * var(--responsive-vw-px));
  padding: calc(1.5 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px));
  position: absolute;
}

.content-introduction .area-2-1 > p > span:first-child {
  font-family: var(--wp--preset--font-family--zebrawood-std);
}

.content-introduction .area-2-1 .wp-block-image {
  width: calc(65 * var(--responsive-vw-px));
}

.content-introduction .area-2-2 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--responsive-vw-px));
  justify-content: center;
}

.content-introduction .area-2-2-1 {
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--responsive-vw-px));
  padding: 0 calc(2.25 * var(--responsive-vw-px));
}

.content-introduction .area-2-2-1 > span {
  display: flex;
  flex-direction: column;
}

.content-introduction .area-2-2-1 > span:first-child {
  color: var(--wp--preset--color--point-blue);
  font-size: calc(3.5 * var(--responsive-vw-px));
}

.content-introduction .area-2-2-1 > span:last-child {
  font-size: calc(2 * var(--responsive-vw-px));
  gap: calc(0.5 * var(--responsive-vw-px));
}

.content-introduction .area-2-2-1 > span:last-child > span {
  line-height: 1.4;
}

.content-introduction .area-2-2-2 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--responsive-vw-px));
  padding: 0 0 calc(4 * var(--responsive-vw-px));
  position: relative;
}

.content-introduction .area-2-2-2 > h4 {
  background: #29B183;
  color: var(--wp--preset--color--base-white);
  font-size: calc(2.25 * var(--responsive-vw-px));
  padding: calc(2 * var(--responsive-vw-px)) calc(5 * var(--responsive-vw-px));
  position: absolute;
  top: calc(-5 * var(--responsive-vw-px));;
}

.content-introduction .area-2-2-2-1 {
  background: #E9FBF5;
  display: flex;
  padding: calc(3 * var(--responsive-vw-px)) calc(2 * var(--responsive-vw-px));
  width: calc(72.875 * var(--responsive-vw-px) - 2 * var(--responsive-vw-px) * 2);
}

.content-introduction .area-2-2-2-1 ul {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
  padding: 0 0 0 calc(4 * var(--vw-px));
}

.content-introduction .area-2-2-2-1 ul li {
  font-size: calc(2.25 * var(--responsive-vw-px));
  line-height: 1.4;
  padding: 0 0 0 calc(1 * var(--vw-px));
}

.content-introduction .area-2-2-2-1 ul li::marker {
  color: #29B183;
  content: "\e905";
  font-family: "icon";
  font-size: calc(1.5 * var(--responsive-vw-px));
}

@media (width <= 768.99px) {
  .content-introduction {
    padding: calc(5 * var(--vw-px)) calc(1 * var(--responsive-vw-px)) 0;
  }

  .content-introduction .area-2 {
    flex-direction: column;
    gap: calc(7 * var(--responsive-vw-px));
  }

  .content-introduction .area-2-1 > p {
    gap: calc(0.5 * var(--responsive-vw-px));
    left: calc(10 * var(--responsive-vw-px));
    width: calc(100% - calc(10 * var(--responsive-vw-px)) * 2);
  }

  .content-introduction .area-2-2-1 > span:first-child {
    gap: calc(0.5 * var(--responsive-vw-px));
  }

  .content-introduction .area-2-2-1 > span:last-child {
    gap: calc(1 * var(--responsive-vw-px));
  }

  .content-introduction .area-2-1 .wp-block-image {
    width: calc(35 * var(--responsive-vw-px));
  }

  .content-introduction .area-2-2-2-1 {
    padding: calc(4 * var(--responsive-vw-px)) calc(3 * var(--responsive-vw-px));
    width: calc(47 * var(--responsive-vw-px) - 2 * var(--responsive-vw-px) * 2);
  }

  .content-introduction .area-2-2-2-1 ul {
    gap: calc(2 * var(--responsive-vw-px));
  }
}

/* --- フォーム --- */

.content-form {
  padding: calc(45 * var(--responsive-vw-px)) 0 calc(10 * var(--max-px));
  position: relative;
}

.content-form .bg {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.content-form .bg.wp-block-image img {
  height: 100%;
  object-fit: cover;
}

.content-form .area-1 {
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--max-px));
}

.content-form .area-1-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(0.25 * var(--vw-px));
}

.content-form .area-1-1 h2 {
  font-size: calc(5.5 * var(--responsive-vw-px));
  letter-spacing: -0.02em;
  text-align: center;
}

.content-form .area-1-1 .wp-block-image {
  height: calc(1.625 * var(--responsive-vw-px));
}

.content-form .wpcf7 form {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.content-form .wpcf7 .symbol {
  color: var(--wp--preset--color--point-yellow-light);
}

.content-form .wpcf7 .form-inner {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(7.5 * var(--vw-px));
}

.content-form .wpcf7 .form-inner > span:first-child {
  align-items: center;
  color: var(--wp--preset--color--base-white);
  display: flex;
  flex-direction: column;
  gap: calc(4.5 * var(--max-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--max-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:first-child {
  align-items: center;
  display: flex;
  gap: calc(1.375 * var(--max-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:first-child > span:first-child {
  background: var(--wp--preset--color--base-white);
  clip-path: polygon(10% 0, 100% 0, 100% 30%, 100% 70%, 90% 100%, 30% 100%, 0 100%, 0% 30%);
  color: var(--wp--preset--color--point-blue);
  font-size: calc(3 * var(--responsive-vw-px));
  padding: calc(1.625 * var(--max-px) * 0.5) calc(3.75 * var(--max-px) * 0.5);
}
.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:first-child > span:last-child {
  font-size: calc(5 * var(--responsive-vw-px));
  font-weight: bold;
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(2.25 * var(--responsive-vw-px));
  gap: calc(2.25 * var(--max-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child > span:first-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child > span:last-child {
  font-size: calc(2.25 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:last-child {
  column-gap: calc(7.25 * var(--vw-px));
  display: grid;
  grid-template-columns: auto calc(90.875 * var(--vw-px));
  row-gap: calc(2.25 * var(--vw-px));
}

.content-form .wpcf7 .form-inner > span:first-child > span:last-child > .label {
  display: grid;
  font-size: calc(2.5 * var(--responsive-vw-px));
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  grid-template-rows: subgrid;
}

.content-form .wpcf7 .form-inner > span:first-child > span:last-child :is(input, textarea) {
  padding: calc(1 * var(--max-px));
  width: calc(100% - calc(1 * var(--max-px)) * 2);
}
.content-form .wpcf7 .form-inner > span:first-child > span:last-child textarea {
  height: calc(30 * var(--max-px));
}

.content-form .wpcf7 .form-inner > span:last-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(6.5 * var(--vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child > span:first-child {
  color: var(--wp--preset--color--base-white);
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child > a:first-child {
  align-items: center;
  color: var(--wp--preset--color--base-white);
  display: flex;
  gap: calc(1 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child > a:first-child > span {
  border-bottom: solid 1px var(--wp--preset--color--base-white);
  padding-bottom: calc(0.5 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child > a:first-child::after {
  align-items: center;
  background: var(--wp--preset--color--base-white);
  border-radius: 100%;
  color: var(--wp--preset--color--point-blue);
  content: "\e901";
  display: flex;
  font-family: "icon";
  font-size: calc(1.5 * var(--responsive-vw-px));
  height: calc(2.5 * var(--responsive-vw-px));
  justify-content: center;
  width: calc(2.5 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:first-child > span:last-child {
  background: var(--wp--preset--color--base-white);
  color: var(--wp--preset--color--point-blue);
  display: flex;
  gap: calc(1.5 * var(--max-px));
  justify-content: center;
  padding: calc(2.5 * var(--max-px)) calc(21 * var(--vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:last-child {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(1 * var(--responsive-vw-px));
  position: relative;
}

.content-form .wpcf7 .form-inner > span:last-child > span > input {
  background: var(--wp--preset--color--point-yellow);
  border: none;
  border-radius: calc(12.5 * var(--max-px));
  color: var(--wp--preset--color--point-blue);
  cursor: pointer;
  display: flex;
  font-size:  calc(2.25 * var(--responsive-vw-px));
  gap: calc(15 * var(--max-px));
  height: calc(8 * var(--responsive-vw-px));
  width: calc(40 * var(--responsive-vw-px));
}

.content-form .wpcf7 .form-inner > span:last-child > span:last-child::after {
  color: var(--wp--preset--color--point-blue);
  content: "\e901";
  font-family: "icon";
  font-size: calc(1.5 * var(--responsive-vw-px));
  position: absolute;
  right: calc(6 * var(--vw-px));
  top: calc(3.5 * var(--responsive-vw-px));
}

.content-form .wpcf7 .wpcf7-response-output {
  color: var(--wp--preset--color--base-white);
  padding: calc(1.5 * var(--responsive-vw-px));
}
.content-form .wpcf7 form.invalid .wpcf7-response-output {
  border-color: #dc3232;
}

@media (width <= 768.99px) {
  .content-form {
    padding: calc(20 * var(--responsive-vw-px)) 0 calc(10 * var(--max-px));
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:first-child {
    flex-direction: column;
  }
  .content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:first-child > span:last-child {
    font-size: calc(4 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child > span:first-child {
    font-size: calc(2 * var(--responsive-vw-px));
    gap: calc(2* var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child > span:first-child > span:first-child {
    display: flex;
    flex-direction: column;
    gap: calc(1 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:first-child > span:last-child > span:last-child {
    font-size: calc(2 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:last-child {
    display: flex;
    flex-direction: column;
    gap: calc(1.5 * var(--responsive-vw-px));
    width: 100%;
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:last-child > .label {
    display: flex;
    flex-direction: column;
    font-size: calc(1.5 * var(--responsive-vw-px));
    gap: calc(1 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .wpcf7-form-control-wrap {
    display: flex;
    justify-content: center;
  }

  .content-form .wpcf7 .form-inner > span:first-child > span:last-child :is(input, textarea) {
    padding: calc(1 * var(--responsive-vw-px));
    width: calc(100% - 2 * var(--responsive-vw-px) - 8px);
  }
  .content-form .wpcf7 .form-inner > span:first-child > span:last-child textarea {
    height: calc(10 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:last-child > span:first-child > span:last-child {
    font-size: calc(1.75 * var(--responsive-vw-px));
    padding: calc(2 * var(--responsive-vw-px)) calc(1 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:last-child > span > input {
    height: calc(5 * var(--responsive-vw-px));
    width: calc(20 * var(--responsive-vw-px));
  }

  .content-form .wpcf7 .form-inner > span:last-child > span:last-child::after {
    right: calc(2 * var(--responsive-vw-px));
    top: calc(1.75 * var(--responsive-vw-px));
  }
}

/* --- フォーム/確認画面 --- */

.wp-site-blocks :has(.content-form.form-confirm) {
  background: var(--wp--preset--color--point-blue);
}

.content-form.form-confirm {
  padding: calc(20 * var(--max-px)) 0 calc(5 * var(--max-px));
}

.content-form.form-confirm .wpcf7 .form-inner > span:first-child > span:first-child {
  font-size: calc(2.15 * var(--responsive-vw-px));
}

.content-form.form-confirm .wpcf7 .form-inner > span:first-child > span:last-child > .label > span:first-child {
  border-bottom: solid 2px var(--wp--preset--color--base-white);
  padding-bottom: calc(1.5 * var(--responsive-vw-px));
}

.content-form.form-confirm .wpcf7 .form-inner > span:last-child {
  align-items: flex-start;
  flex-direction: row;
  gap: calc(1.5 * var(--responsive-vw-px));
}

.content-form.form-confirm .wpcf7 .form-inner > span:last-child > span:first-child {
  position: relative;
}

.content-form.form-confirm .wpcf7 .form-inner > span:last-child > span:first-child::before {
  color: var(--wp--preset--color--point-blue);
  content: "\e901";
  font-family: "icon";
  font-size: calc(1.5 * var(--responsive-vw-px));
  left: calc(5 * var(--vw-px));
  position: absolute;
  top: calc(3.5 * var(--responsive-vw-px));
  transform: rotate(180deg);
}

.content-form.form-confirm .wpcf7 .form-inner > span:last-child > span:first-child > input {
  background: var(--wp--preset--color--base-white);
}

@media (width <= 768.99px) {
  .content-form.form-confirm .wpcf7 .form-inner > span:last-child {
    align-items: center;
    flex-direction: column;
  }

  .content-form.form-confirm .wpcf7 .form-inner > span:last-child > span:first-child::before {
    left: calc(2 * var(--responsive-vw-px));
    top: calc(1.75 * var(--responsive-vw-px));
  }

  .content-form.form-confirm .wpcf7 .form-inner > span:last-child > span:first-child::after {
    top: calc(7.75 * var(--responsive-vw-px));
  }
}

/* --- サンクスページ --- */

.wp-site-blocks :has(.content-form-thanks) {
  background: var(--wp--preset--color--base-white);
}

.content-form-thanks {
  align-items: center;
  color: var(--wp--preset--color--point-blue);
  display: flex;
  flex-direction: column;
  gap: calc(7.5 * var(--vw-px));
  padding: calc(25 * var(--max-px)) calc(8 * var(--max-px)) calc(5 * var(--max-px));
}

.content-form-thanks h1 {
  font-size: calc(3 * var(--responsive-vw-px));
}

.content-form-thanks .area-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--responsive-vw-px));
}

.content-form-thanks .area-1-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: calc(2 * var(--responsive-vw-px));
  gap: calc(4 * var(--responsive-vw-px));
}

.content-form-thanks .area-1-1-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: calc(2 * var(--responsive-vw-px));
  text-align: center;
}

.content-form-thanks .area-1-1-1 > span {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.content-form-thanks .area-1-1-2 {
  text-align: center;
}

.content-form-thanks .area-1-2 .wp-block-button__link {
  align-items: center;
  background: var(--wp--preset--color--point-blue);
  border: none;
  border-radius: calc(12.5 * var(--max-px));
  color: var(--wp--preset--color--base-white);
  cursor: pointer;
  display: flex;
  display: flex;
  font-size: calc(2.25 * var(--responsive-vw-px));
  gap: calc(15 * var(--max-px));
  height: calc(8 * var(--responsive-vw-px));
  justify-content: center;
  padding: 0;
  width: calc(40 * var(--responsive-vw-px));
}

@media (width <= 768.99px) {
  .content-form-thanks {
    padding: calc(20 * var(--max-px)) calc(4 * var(--max-px)) calc(5 * var(--max-px));
  }

  .content-form-thanks .area-1-2 .wp-block-button__link {
    height: calc(5 * var(--responsive-vw-px));
    width: calc(20 * var(--responsive-vw-px));
  }
}