@charset "UTF-8";
:root {
  --yb-blue: #00a0e9;
  --yb-black: #131313;
  --yb-white: #ffffff;
  --yb-gray: #6b7175;
  --yb-border: #dfe1e0;
  --yb-line: #a6a6a7;
  --yb-blue-05: #e5f5fd;
  --yb-blue-10: #e6f6fd;
  --yb-link-hover: #858b8e;
  --yb-shell: 720px;
  --yb-pad: 48px;
  --yb-header: 88px;
  --yb-home-strip-height: 110px;
  --yb-course-side-top: var(--yb-header);
  --yb-value-bg-top: var(--yb-header);
  --yb-language-bg-top: var(--yb-header);
  --yb-fixed-bg-top: var(--yb-header);
  --yb-font-jp: "YakuHanJP", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --yb-font-en: "Outfit", Arial, sans-serif;
  --yb-font-hand: ta-oonishi, sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body.yb-body {
  margin: 0;
  background: var(--yb-white);
  color: var(--yb-black);
  font-family: var(--yb-font-jp);
  font-size: 16px;
  letter-spacing: 0.025em;
  line-height: 1.7;
  overflow-x: hidden;
  overscroll-behavior-x: none;
}

body.yb-body.is-yb-menu-open {
  overflow: hidden;
}

img,
svg {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}

dd {
  margin: 0;
}

.yb-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.yb-site {
  min-height: 100vh;
  background: var(--yb-white);
}

.yb-home {
  position: relative;
}

.yb-home > section {
  position: relative;
  z-index: 1;
}

.yb-fixed-bg {
  position: fixed;
  left: 0;
  right: var(--yb-shell);
  top: var(--yb-fixed-bg-top);
  z-index: 0;
  width: auto;
  height: calc(100vh - var(--yb-fixed-bg-top));
  overflow: hidden;
  pointer-events: none;
  transition: top 0.28s ease, height 0.28s ease;
}

body:has(.yb-header.is-yb-header-hidden) {
  --yb-fixed-bg-top: 0px;
}

.yb-fixed-bg__layer {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.55s ease;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.yb-fixed-bg__layer.is-active {
  opacity: 1;
}

.yb-fixed-bg__content {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.yb-fixed-bg__content--info-yokobi {
  left: -3px;
  top: 50%;
  width: auto;
  max-width: none;
  height: 96%;
  transform: translateY(-50%);
}

.yb-mobile-left-visual {
  display: none;
}

.yb-main {
  padding: 0;
}

.yb-shell {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  margin-right: 0;
  padding-inline: var(--yb-pad);
}

.yb-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  align-items: stretch;
  width: 100%;
  height: var(--yb-header);
  background: var(--yb-white);
  transition: transform 0.28s ease;
  will-change: transform;
}

.yb-header.is-yb-header-hidden {
  transform: translateY(-100%);
}

body.is-yb-menu-open .yb-header {
  transform: translateY(0);
}

body.is-yb-menu-open .yb-header--english .yb-header__subnav {
  opacity: 0;
  pointer-events: none;
}

body.is-yb-header-search-mode .yb-header__subnav,
body.is-yb-header-language-mode .yb-header__subnav {
  display: none;
}

.yb-header__main {
  display: flex;
  align-items: center;
  gap: 64px;
  flex: 1 1 auto;
  min-width: 0;
  padding: 24px 8px 24px var(--yb-pad);
}

.yb-header__logo {
  flex: 0 0 auto;
  width: 181.395px;
  margin: 0;
}

.yb-header--english .yb-header__logo {
  width: 130px;
}

.yb-header__logo a {
  display: block;
}

.yb-header__logo img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-header__nav,
.yb-header__subnav {
  display: flex;
  align-items: center;
  gap: 40px;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-header__nav {
  flex: 1 1 auto;
  min-width: 0;
}

.yb-header__nav a {
  transition: color 0.2s ease;
}

.yb-header__nav a:hover,
.yb-header__nav a:focus-visible {
  color: var(--yb-blue);
}

.yb-header__subnav {
  gap: 32px;
  margin-left: auto;
  margin-right: calc(-1 * 32px);
  transition: opacity 0.18s ease;
}

.yb-header__subnav .yb-icon-link {
  transition: color 0.2s ease;
}

.yb-header__subnav .yb-icon-link:hover,
.yb-header__subnav .yb-icon-link:focus-visible {
  color: var(--yb-blue);
}

.yb-header__tools {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.yb-header__tool {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 24px;
  flex: 0 0 18px;
}

.yb-header__tool,
.yb-header__mode-close {
  cursor: pointer;
}

.yb-header__tool img {
  display: block;
  object-fit: contain;
}

.yb-header__tool--search img {
  width: 18px;
  height: 18px;
}

.yb-header__tool--language {
  width: 16px;
  flex-basis: 16px;
}

.yb-header__tool-divider {
  display: block;
  width: 16px;
  height: 26px;
  flex: 0 0 16px;
  background: linear-gradient(var(--yb-border), var(--yb-border)) center/1px 18px no-repeat;
}

.yb-header__search-panel {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 0;
  flex: 0 0 0;
  margin-left: calc(-1 * 8px);
  min-width: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid transparent;
  overflow: visible;
  pointer-events: none;
}

.yb-header__search-form {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
  color: var(--yb-gray);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.yb-header__search-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.yb-header__search-submit img {
  display: block;
  width: 18px;
  height: 18px;
  opacity: 0;
  visibility: hidden;
  object-fit: contain;
}

.yb-header__search-input {
  min-width: 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--yb-black);
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  transform: translateY(4px);
}

.yb-header__search-input::-webkit-search-decoration,
.yb-header__search-input::-webkit-search-cancel-button,
.yb-header__search-input::-webkit-search-results-button,
.yb-header__search-input::-webkit-search-results-decoration {
  display: none;
  -webkit-appearance: none;
  appearance: none;
}

.yb-header__search-input::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

.yb-header__search-input::placeholder {
  color: var(--yb-gray);
  opacity: 1;
}

.yb-header__search-input:focus {
  outline: 0;
}

.yb-header__mode-close {
  position: relative;
  width: 1px;
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.16s ease 0.12s, visibility 0s linear 0.28s;
}

.yb-header__mode-close::before,
.yb-header__mode-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 1px;
  background: var(--yb-gray);
  transform-origin: center;
}

.yb-header__mode-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.yb-header__mode-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.yb-header__language-panel {
  display: flex;
  align-items: center;
  gap: 0;
  width: 0;
  flex: 0 0 0;
  margin-left: calc(-1 * 8px);
  padding-bottom: 8px;
  overflow: visible;
  pointer-events: none;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.yb-header__language-panel img {
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-right: 10px;
  object-fit: contain;
  transform: translate(322px, 4px);
  transition: transform 0.38s ease;
}

.yb-header__language-panel a {
  display: inline-flex;
  align-items: center;
  height: 16px;
  font-family: var(--yb-font-en);
  text-decoration-color: var(--yb-link-hover);
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  opacity: 0;
  transform: translateY(10px);
}

.yb-header__language-panel a + a {
  margin-left: 24px;
}

.yb-header__language-panel a.is-current {
  color: var(--yb-blue);
  font-family: var(--yb-font-jp);
}

.yb-header__language-panel a:hover,
.yb-header__language-panel a:focus-visible {
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-header__tool--language img {
  width: 16px;
  height: 16px;
}

body.is-yb-header-search-mode .yb-header__tools {
  width: 329px;
}

body.is-yb-header-language-mode .yb-header__tools {
  width: 388px;
}

body.is-yb-header-language-mode .yb-header__tool--language-trigger {
  display: none;
}

body.is-yb-header-search-mode .yb-header__search-panel,
body.is-yb-header-language-mode .yb-header__language-panel {
  display: flex;
}

body.is-yb-header-search-mode .yb-header__search-panel {
  width: 281px;
  flex-basis: 281px;
  margin-left: 0;
  border-color: var(--yb-blue);
  pointer-events: auto;
}

body.is-yb-header-search-mode .yb-header__tool--search-trigger {
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 2;
  pointer-events: none;
  margin-top: calc(-1 * 12px);
  animation: yb-header-search-icon-slide 0.38s ease both;
}

body.is-yb-header-search-mode .yb-header__mode-close {
  opacity: 1;
  visibility: visible;
  transition-delay: 0.12s, 0s;
}

body.is-yb-header-language-mode .yb-header__language-panel {
  width: 338px;
  flex-basis: 338px;
  margin-left: 0;
  pointer-events: auto;
  transition: width 0.38s ease, flex-basis 0.38s ease;
}

body.is-yb-header-language-mode .yb-header__language-panel img {
  transform: translateY(4px);
}

body.is-yb-header-language-mode .yb-header__language-panel a {
  opacity: 1;
  transform: translateY(4px);
  transition: opacity 0.22s ease, transform 0.22s ease;
}

body.is-yb-header-language-mode .yb-header__language-panel a:nth-of-type(1) {
  transition-delay: 0.18s;
}

body.is-yb-header-language-mode .yb-header__language-panel a:nth-of-type(2) {
  transition-delay: 0.22s;
}

body.is-yb-header-language-mode .yb-header__language-panel a:nth-of-type(3) {
  transition-delay: 0.26s;
}

body.is-yb-header-language-mode .yb-header__language-panel a:nth-of-type(4) {
  transition-delay: 0.3s;
}

body.is-yb-header-language-mode .yb-header__language-panel a:nth-of-type(5) {
  transition-delay: 0.34s;
}

body.is-yb-header-search-closing .yb-header__tool--search-trigger {
  z-index: 2;
  pointer-events: none;
}

body.is-yb-header-search-closing .yb-header__tool--search-trigger img {
  animation: yb-header-search-icon-return 0.38s ease both;
}

body.is-yb-header-search-closing .yb-header__mode-close {
  opacity: 0;
  visibility: hidden;
  transition: none;
}

body.is-yb-header-search-closing .yb-header__subnav,
body.is-yb-header-language-closing .yb-header__subnav,
body.is-yb-header-language-closing .yb-header__tool--search-trigger {
  opacity: 0;
  pointer-events: none;
  animation: yb-header-tool-delayed-fade-in 0.18s ease 0.38s both;
}

body.is-yb-header-language-closing .yb-header__tool--language-trigger {
  z-index: 2;
  pointer-events: none;
}

body.is-yb-header-language-closing .yb-header__tool--language-trigger img {
  animation: yb-header-language-icon-return 0.38s ease both;
}

@keyframes yb-header-search-icon-slide {
  from {
    transform: translateX(263px);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes yb-header-search-icon-return {
  from {
    transform: translateX(calc(-1 * 263px));
  }
  to {
    transform: translateX(0);
  }
}
@keyframes yb-header-language-icon-return {
  from {
    transform: translateX(calc(-1 * 322px));
  }
  to {
    transform: translateX(0);
  }
}
@keyframes yb-header-tool-delayed-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.yb-icon-link,
.yb-pill-button {
  --yb-icon-color: var(--yb-blue);
  --yb-icon-path: url("../img/common/icon-pamphlet.svg");
}

.yb-icon-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.yb-icon-link::before,
.yb-pill-button::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  background-color: var(--yb-icon-color);
  mask-image: var(--yb-icon-path);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-pill-button::before {
  width: 26.67px;
  height: 26.67px;
}

.yb-icon-link--book,
.yb-pill-button--book {
  --yb-icon-path: url("../img/common/icon-pamphlet.svg");
}

.yb-icon-link--mail,
.yb-pill-button--mail {
  --yb-icon-path: url("../img/common/icon-mail.svg");
}

.yb-menu-button {
  --yb-menu-line-color-duration: 28s;
  position: relative;
  display: flex;
  flex: 0 0 144px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  cursor: pointer;
}

.yb-menu-button span:not(.yb-visually-hidden) {
  --yb-menu-line-orbit-delay: 0s;
  --yb-menu-line-color-delay: 0s;
  position: relative;
  display: block;
  width: 48px;
  height: max(1px, min(0.2777777778vw, 2px));
  overflow: hidden;
  background: var(--yb-blue);
  transform-origin: center;
  transition: background-color 0.18s linear, transform 0.2s ease, opacity 0.2s ease;
  animation: yb-menu-line-color-base var(--yb-menu-line-color-duration) linear infinite;
  animation-delay: var(--yb-menu-line-color-delay);
  will-change: transform, background-color;
}

.yb-menu-button span:not(.yb-visually-hidden)::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #d80c18;
  transform: scaleX(0);
  transform-origin: right center;
  animation: yb-menu-line-color-wipe var(--yb-menu-line-color-duration) linear infinite;
  animation-delay: var(--yb-menu-line-color-delay);
  will-change: transform, background-color;
}

.yb-menu-button span:nth-child(1) {
  --yb-menu-line-color-1: #d80c18;
  --yb-menu-line-color-2: #f08300;
  --yb-menu-line-color-3: #8fc31f;
  --yb-menu-line-color-4: #009ba2;
  --yb-menu-line-color-5: #32a238;
  --yb-menu-line-color-6: #4694d1;
  --yb-menu-line-color-7: #892188;
  --yb-menu-line-color-8: #e8528e;
  --yb-menu-line-color-9: #fabe00;
  --yb-menu-line-color-10: #94252a;
  --yb-menu-line-orbit-delay: 0s;
  --yb-menu-line-color-delay: 0s;
}

.yb-menu-button span:nth-child(2) {
  --yb-menu-line-color-1: #eb5555;
  --yb-menu-line-color-2: #f5a53c;
  --yb-menu-line-color-3: #aacd3c;
  --yb-menu-line-color-4: #2db4aa;
  --yb-menu-line-color-5: #73b44b;
  --yb-menu-line-color-6: #5faadc;
  --yb-menu-line-color-7: #a55fb9;
  --yb-menu-line-color-8: #f06aa3;
  --yb-menu-line-color-9: #fdd35d;
  --yb-menu-line-color-10: #b46969;
  --yb-menu-line-orbit-delay: 0.12s;
  --yb-menu-line-color-delay: 0.18s;
}

.yb-menu-button span:nth-child(3) {
  --yb-menu-line-color-1: #f5a09b;
  --yb-menu-line-color-2: #facd8c;
  --yb-menu-line-color-3: #d0e59d;
  --yb-menu-line-color-4: #96dcd2;
  --yb-menu-line-color-5: #afd787;
  --yb-menu-line-color-6: #9bcdeb;
  --yb-menu-line-color-7: #c89bd7;
  --yb-menu-line-color-8: #f59dc1;
  --yb-menu-line-color-9: #fee8b1;
  --yb-menu-line-color-10: #d29696;
  --yb-menu-line-orbit-delay: 0.24s;
  --yb-menu-line-color-delay: 0.36s;
}

.yb-menu-button:hover span:not(.yb-visually-hidden),
.yb-menu-button:focus-visible span:not(.yb-visually-hidden) {
  animation-name: yb-menu-line-orbit, yb-menu-line-color-base;
  animation-duration: 0.48s, var(--yb-menu-line-color-duration);
  animation-timing-function: linear, linear;
  animation-delay: var(--yb-menu-line-orbit-delay), var(--yb-menu-line-color-delay);
  animation-iteration-count: 1, infinite;
  animation-fill-mode: both, none;
}

body.is-yb-menu-open .yb-menu-button span:not(.yb-visually-hidden) {
  animation: none;
}

body.is-yb-menu-open .yb-menu-button span:not(.yb-visually-hidden)::before {
  animation: none;
  transform: scaleX(0);
}

body.is-yb-menu-open .yb-menu-button span:nth-child(1) {
  transform: translateY(10px) rotate(18deg);
}

body.is-yb-menu-open .yb-menu-button span:nth-child(2) {
  opacity: 0;
}

body.is-yb-menu-open .yb-menu-button span:nth-child(3) {
  transform: translateY(-10px) rotate(-18deg);
}

@keyframes yb-menu-line-orbit {
  0%, 100% {
    transform: scaleX(1);
  }
  50% {
    transform: scaleX(0.12);
  }
}
@keyframes yb-menu-line-color-base {
  0%, 2%, 100% {
    background-color: var(--yb-menu-line-color-10);
  }
  2.01%, 12% {
    background-color: var(--yb-menu-line-color-1);
  }
  12.01%, 22% {
    background-color: var(--yb-menu-line-color-2);
  }
  22.01%, 32% {
    background-color: var(--yb-menu-line-color-3);
  }
  32.01%, 42% {
    background-color: var(--yb-menu-line-color-4);
  }
  42.01%, 52% {
    background-color: var(--yb-menu-line-color-5);
  }
  52.01%, 62% {
    background-color: var(--yb-menu-line-color-6);
  }
  62.01%, 72% {
    background-color: var(--yb-menu-line-color-7);
  }
  72.01%, 82% {
    background-color: var(--yb-menu-line-color-8);
  }
  82.01%, 92% {
    background-color: var(--yb-menu-line-color-9);
  }
  92.01%, 99.99% {
    background-color: var(--yb-menu-line-color-10);
  }
}
@keyframes yb-menu-line-color-wipe {
  0% {
    background-color: var(--yb-menu-line-color-1);
    transform: scaleX(0);
  }
  2% {
    background-color: var(--yb-menu-line-color-1);
    transform: scaleX(1);
  }
  2.01%, 9.99% {
    background-color: var(--yb-menu-line-color-2);
    transform: scaleX(0);
  }
  10% {
    background-color: var(--yb-menu-line-color-2);
    transform: scaleX(0);
  }
  12% {
    background-color: var(--yb-menu-line-color-2);
    transform: scaleX(1);
  }
  12.01%, 19.99% {
    background-color: var(--yb-menu-line-color-3);
    transform: scaleX(0);
  }
  20% {
    background-color: var(--yb-menu-line-color-3);
    transform: scaleX(0);
  }
  22% {
    background-color: var(--yb-menu-line-color-3);
    transform: scaleX(1);
  }
  22.01%, 29.99% {
    background-color: var(--yb-menu-line-color-4);
    transform: scaleX(0);
  }
  30% {
    background-color: var(--yb-menu-line-color-4);
    transform: scaleX(0);
  }
  32% {
    background-color: var(--yb-menu-line-color-4);
    transform: scaleX(1);
  }
  32.01%, 39.99% {
    background-color: var(--yb-menu-line-color-5);
    transform: scaleX(0);
  }
  40% {
    background-color: var(--yb-menu-line-color-5);
    transform: scaleX(0);
  }
  42% {
    background-color: var(--yb-menu-line-color-5);
    transform: scaleX(1);
  }
  42.01%, 49.99% {
    background-color: var(--yb-menu-line-color-6);
    transform: scaleX(0);
  }
  50% {
    background-color: var(--yb-menu-line-color-6);
    transform: scaleX(0);
  }
  52% {
    background-color: var(--yb-menu-line-color-6);
    transform: scaleX(1);
  }
  52.01%, 59.99% {
    background-color: var(--yb-menu-line-color-7);
    transform: scaleX(0);
  }
  60% {
    background-color: var(--yb-menu-line-color-7);
    transform: scaleX(0);
  }
  62% {
    background-color: var(--yb-menu-line-color-7);
    transform: scaleX(1);
  }
  62.01%, 69.99% {
    background-color: var(--yb-menu-line-color-8);
    transform: scaleX(0);
  }
  70% {
    background-color: var(--yb-menu-line-color-8);
    transform: scaleX(0);
  }
  72% {
    background-color: var(--yb-menu-line-color-8);
    transform: scaleX(1);
  }
  72.01%, 79.99% {
    background-color: var(--yb-menu-line-color-9);
    transform: scaleX(0);
  }
  80% {
    background-color: var(--yb-menu-line-color-9);
    transform: scaleX(0);
  }
  82% {
    background-color: var(--yb-menu-line-color-9);
    transform: scaleX(1);
  }
  82.01%, 89.99% {
    background-color: var(--yb-menu-line-color-10);
    transform: scaleX(0);
  }
  90% {
    background-color: var(--yb-menu-line-color-10);
    transform: scaleX(0);
  }
  92% {
    background-color: var(--yb-menu-line-color-10);
    transform: scaleX(1);
  }
  92.01%, 100% {
    background-color: var(--yb-menu-line-color-1);
    transform: scaleX(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .yb-menu-button span:not(.yb-visually-hidden),
  .yb-menu-button:hover span:not(.yb-visually-hidden),
  .yb-menu-button:focus-visible span:not(.yb-visually-hidden) {
    animation: none;
  }
  .yb-menu-button span:not(.yb-visually-hidden)::before {
    animation: none;
    transform: scaleX(0);
  }
}
.yb-menu {
  position: fixed;
  inset: var(--yb-header) 0 auto auto;
  z-index: 999;
  width: min(100%, var(--yb-shell));
  height: calc(100vh - var(--yb-header));
  pointer-events: none;
  visibility: hidden;
}

.yb-menu__panel {
  height: 100%;
  padding: 56px var(--yb-pad);
  transform: translateX(100%);
  transition: transform 0.28s ease;
  border-left: 1px solid var(--yb-border);
  background: rgba(255, 255, 255, 0.96);
  overflow-y: auto;
}

body.is-yb-menu-open .yb-menu {
  pointer-events: auto;
  visibility: visible;
}

body.is-yb-menu-open .yb-menu__panel {
  transform: translateX(0);
}

.yb-menu__primary,
.yb-menu__audience {
  display: grid;
  gap: 0;
}

.yb-menu__primary a,
.yb-menu__audience a {
  display: flex;
  align-items: center;
  min-height: 56px;
  border-bottom: 1px solid var(--yb-line);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.yb-menu__audience {
  margin-top: 48px;
}

.yb-menu--language {
  inset: var(--yb-header) 0 auto;
  width: 100%;
}

.yb-menu__panel--language {
  display: flex;
  flex-direction: column;
  padding: 0;
  border-left: 0;
  background: var(--yb-white);
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.22s ease, transform 0.22s ease;
}

body.is-yb-menu-open .yb-menu__panel--language {
  opacity: 1;
  transform: translateY(0);
}

.yb-menu__language-layout {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 100%;
}

.yb-menu__language-main {
  display: grid;
  align-items: start;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 72px;
  flex: 1 1 auto;
  min-height: 0;
  padding: 32px 48px 32px 80px;
}

.yb-menu__language-search-row {
  display: none;
}

.yb-menu__language-sp-global {
  display: none;
}

.yb-menu__language-columns {
  display: contents;
  min-height: 0;
}

.yb-menu__language-list,
.yb-menu__language-pages {
  display: grid;
  gap: 24px;
  align-content: start;
}

.yb-menu__language-list a,
.yb-menu__language-pages a {
  --yb-menu-link-border-color: var(--yb-line);
  --yb-menu-link-arrow-color: var(--yb-black);
  --yb-menu-link-line-color: var(--yb-link-hover);
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 12px 4px 8px;
  border-bottom: 1px solid var(--yb-menu-link-border-color);
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.5;
  transition: border-color 0.18s ease, color 0.18s ease;
}

.yb-menu__language-list a::before,
.yb-menu__language-pages a::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--yb-menu-link-line-color);
  transform: scaleX(0);
  transform-origin: left center;
  transition: background-color 0.18s ease, transform 0.28s ease;
}

.yb-menu__language-list a::after,
.yb-menu__language-pages a::after {
  content: "";
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  background-color: var(--yb-menu-link-arrow-color);
  mask: url("../img/common/arrow-black.svg") center/16px 16px no-repeat;
  -webkit-mask: url("../img/common/arrow-black.svg") center/16px 16px no-repeat;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.yb-menu__language-list a.is-current,
.yb-menu__language-list a:hover,
.yb-menu__language-list a:focus-visible,
.yb-menu__language-pages a:hover,
.yb-menu__language-pages a:focus-visible,
.yb-menu__language-columns.is-submenu-open .yb-menu__language-list a.has-submenu {
  --yb-menu-link-border-color: var(--yb-link-hover);
  --yb-menu-link-arrow-color: var(--yb-link-hover);
  color: var(--yb-black);
  font-weight: 500;
}

.yb-menu__language-list a:hover::before,
.yb-menu__language-list a:focus-visible::before,
.yb-menu__language-pages a:hover::before,
.yb-menu__language-pages a:focus-visible::before {
  transform: scaleX(1);
}

.yb-menu__language-list a.is-current,
.yb-menu__language-columns.is-submenu-open .yb-menu__language-list a.has-submenu {
  --yb-menu-link-border-color: var(--yb-blue);
  --yb-menu-link-arrow-color: var(--yb-blue);
  --yb-menu-link-line-color: var(--yb-blue);
}

.yb-menu__language-list a.is-current::before,
.yb-menu__language-columns.is-submenu-open .yb-menu__language-list a.has-submenu::before {
  transform: scaleX(1);
}

.yb-menu__language-columns.is-submenu-open .yb-menu__language-list a.is-current:not(.has-submenu) {
  --yb-menu-link-border-color: var(--yb-line);
  --yb-menu-link-arrow-color: var(--yb-black);
  --yb-menu-link-line-color: var(--yb-link-hover);
  font-weight: 400;
}

.yb-menu__language-columns.is-submenu-open .yb-menu__language-list a.is-current:not(.has-submenu)::before {
  transform: scaleX(0);
}

.yb-menu__language-pages {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, visibility 0.18s ease;
}

.yb-menu__language-columns.has-active-submenu .yb-menu__language-pages,
.yb-menu__language-columns.is-submenu-open .yb-menu__language-pages,
.yb-menu__language-columns:has(.yb-menu__language-list a.has-submenu:hover) .yb-menu__language-pages,
.yb-menu__language-columns:has(.yb-menu__language-list a.has-submenu:focus-visible) .yb-menu__language-pages,
.yb-menu__language-columns:has(.yb-menu__language-pages:hover) .yb-menu__language-pages,
.yb-menu__language-columns:has(.yb-menu__language-pages:focus-within) .yb-menu__language-pages {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.yb-menu__language-columns.has-active-submenu:has(.yb-menu__language-list a:not(.has-submenu):hover) .yb-menu__language-pages,
.yb-menu__language-columns.has-active-submenu:has(.yb-menu__language-list a:not(.has-submenu):focus-visible) .yb-menu__language-pages {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.yb-menu__language-actions {
  display: grid;
  align-content: end;
  gap: 16px;
  flex: 0 0 auto;
  min-width: 0;
  padding-bottom: 24px;
}

.yb-menu__language-cta,
.yb-menu__language-sns,
.yb-menu__language-related {
  display: flex;
  align-items: center;
  gap: 24px;
}

.yb-menu__language-cta {
  gap: 48px;
  padding-left: 4px;
}

.yb-menu__language-cta--desktop {
  display: flex;
  align-items: center;
}

.yb-menu__language-cta .yb-icon-link {
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-menu__language-cta .yb-icon-link::before {
  width: 28px;
  height: 28px;
}

.yb-menu__language-sns {
  gap: 24px;
  padding: 0 16px 12px 2px;
}

.yb-menu__language-sns img {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.yb-menu__language-sns a:last-child img {
  width: 40px;
  height: 28px;
}

.yb-menu__language-related {
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding-left: 4px;
}

.yb-menu__language-related a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--yb-gray);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-menu__language-related a::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 8px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/chevron-right.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-menu__language-footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 48px;
  flex: 0 0 auto;
  min-height: 128px;
  min-width: 0;
  padding: 24px 24px 0 88px;
  overflow: hidden;
}

.yb-menu__language-brand {
  width: min(47.6388888889vw, 686px);
  flex: 0 1 min(47.6388888889vw, 686px);
  min-width: 0;
  overflow: hidden;
}

.yb-menu__language-brand img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-menu--japanese {
  --yb-menu-min-height: 612px;
  inset: var(--yb-header) 0 auto;
  width: 100vw;
  max-width: 100vw;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.yb-menu__panel--japanese {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  min-height: max(100%, var(--yb-menu-min-height));
  padding: 0;
  border-left: 0;
  background: var(--yb-white);
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.22s ease, transform 0.22s ease;
}

body.is-yb-menu-open .yb-menu__panel--japanese {
  opacity: 1;
  transform: translateY(0);
}

.yb-menu__ja-layout {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 100%;
  min-height: max(100%, var(--yb-menu-min-height));
}

.yb-menu__ja-main {
  display: grid;
  align-items: start;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 72px;
  flex: 1 1 auto;
  min-height: 0;
  padding: 32px 48px 32px 80px;
}

.yb-menu__ja-search-row {
  display: none;
}

.yb-menu__ja-sections {
  display: grid;
  align-content: start;
  gap: 16px;
  min-height: 0;
  overflow: hidden;
}

.yb-menu__ja-section-link,
.yb-menu__ja-child-link {
  --yb-menu-link-border-color: var(--yb-line);
  --yb-menu-link-arrow-color: var(--yb-black);
  --yb-menu-link-line-color: var(--yb-link-hover);
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  padding: 8px 4px 12px;
  border-bottom: 1px solid var(--yb-menu-link-border-color);
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.5;
  transition: border-color 0.18s ease, color 0.18s ease;
}

.yb-menu__ja-section-link::before,
.yb-menu__ja-child-link::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--yb-menu-link-line-color);
  transform: scaleX(0);
  transform-origin: left center;
  transition: background-color 0.18s ease, transform 0.28s ease;
}

.yb-menu__ja-section-link::after,
.yb-menu__ja-child-link::after {
  content: "";
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  background-color: var(--yb-menu-link-arrow-color);
  mask: url("../img/common/arrow-black.svg") center/16px 16px no-repeat;
  -webkit-mask: url("../img/common/arrow-black.svg") center/16px 16px no-repeat;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.yb-menu__ja-child-link--external::after {
  mask: url("../img/common/icon-blank.svg") center/16px 16px no-repeat;
  -webkit-mask: url("../img/common/icon-blank.svg") center/16px 16px no-repeat;
}

.yb-menu__ja-section-link:hover,
.yb-menu__ja-section-link:focus-visible,
.yb-menu__ja-child-link:hover,
.yb-menu__ja-child-link:focus-visible {
  --yb-menu-link-border-color: var(--yb-link-hover);
  --yb-menu-link-arrow-color: var(--yb-link-hover);
  font-weight: 500;
}

.yb-menu__ja-section-link:hover::before,
.yb-menu__ja-section-link:focus-visible::before,
.yb-menu__ja-child-link:hover::before,
.yb-menu__ja-child-link:focus-visible::before {
  transform: scaleX(1);
}

.yb-menu__ja-section-link.is-active {
  --yb-menu-link-border-color: var(--yb-blue);
  --yb-menu-link-arrow-color: var(--yb-blue);
  --yb-menu-link-line-color: var(--yb-blue);
  font-weight: 500;
}

.yb-menu__ja-section-link.is-active::before {
  transform: scaleX(1);
}

.yb-menu__ja-children-wrap {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: var(--yb-menu-left-height, auto);
  padding-right: 28px;
}

.yb-menu__ja-child-list--pc {
  display: grid;
  align-content: start;
  gap: 16px;
  height: 100%;
  min-height: 0;
  padding-right: 28px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link {
  --yb-menu-child-enter-delay: 0s;
  animation: yb-menu-child-enter 0.24s ease both;
  animation-delay: var(--yb-menu-child-enter-delay);
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(2) {
  --yb-menu-child-enter-delay: 0.035s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(3) {
  --yb-menu-child-enter-delay: 0.07s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(4) {
  --yb-menu-child-enter-delay: 0.105s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(5) {
  --yb-menu-child-enter-delay: 0.14s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(6) {
  --yb-menu-child-enter-delay: 0.175s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(7) {
  --yb-menu-child-enter-delay: 0.21s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(8) {
  --yb-menu-child-enter-delay: 0.245s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(9) {
  --yb-menu-child-enter-delay: 0.28s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(10) {
  --yb-menu-child-enter-delay: 0.315s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(11) {
  --yb-menu-child-enter-delay: 0.35s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(12) {
  --yb-menu-child-enter-delay: 0.385s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(13) {
  --yb-menu-child-enter-delay: 0.42s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(14) {
  --yb-menu-child-enter-delay: 0.455s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(15) {
  --yb-menu-child-enter-delay: 0.49s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(16) {
  --yb-menu-child-enter-delay: 0.525s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(17) {
  --yb-menu-child-enter-delay: 0.56s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(18) {
  --yb-menu-child-enter-delay: 0.595s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(19) {
  --yb-menu-child-enter-delay: 0.63s;
}

.yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link:nth-child(20) {
  --yb-menu-child-enter-delay: 0.665s;
}

@keyframes yb-menu-child-enter {
  0% {
    opacity: 0;
    transform: translateY(5px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .yb-menu__ja-section-link::before,
  .yb-menu__ja-child-link::before {
    transition: none;
  }
  .yb-menu__ja-child-list--pc.is-active .yb-menu__ja-child-link {
    animation: none;
  }
}
.yb-menu__ja-child-list--pc::-webkit-scrollbar {
  display: none;
}

.yb-menu__ja-accordion {
  display: none;
}

.yb-menu__ja-child-list--pc[hidden],
.yb-menu__ja-accordion[hidden] {
  display: none;
}

.yb-menu__ja-scrollbar {
  display: none;
  position: absolute;
  top: 0;
  right: 4px;
  bottom: 0;
  width: 4px;
  pointer-events: none;
}

.yb-menu__ja-scrollbar::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: var(--yb-border);
  transform: translateX(-50%);
}

.yb-menu__ja-scrollbar span {
  display: block;
  position: absolute;
  top: var(--yb-menu-scroll-thumb-top, 0);
  left: 0;
  width: 4px;
  height: var(--yb-menu-scroll-thumb-height, 240px);
  background: var(--yb-gray);
  transform: translateY(0);
}

.yb-menu__ja-children-wrap.has-scrollbar .yb-menu__ja-scrollbar {
  display: block;
}

@media (max-height: 760px) and (min-width: 901px) {
  .yb-menu__ja-main {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .yb-menu__ja-sections,
  .yb-menu__ja-child-list--pc {
    gap: 8px;
  }
  .yb-menu__ja-footer {
    min-height: 112px;
    padding-top: 16px;
  }
  .yb-menu__ja-footer-links {
    gap: 12px;
    padding-bottom: 16px;
  }
}
.yb-menu__ja-sp-global {
  display: none;
}

.yb-menu__ja-footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 48px;
  flex: 0 0 auto;
  min-height: 128px;
  padding: 24px 24px 0 88px;
  overflow: hidden;
}

.yb-menu__ja-footer-links {
  display: grid;
  align-content: end;
  gap: 16px;
  flex: 0 0 auto;
  padding-bottom: 24px;
}

.yb-menu__ja-sns,
.yb-menu__ja-related {
  display: flex;
  align-items: center;
}

.yb-menu__ja-sns {
  gap: 24px;
}

.yb-menu__ja-sns img {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.yb-menu__ja-sns a:last-child img {
  width: 40px;
  height: 28px;
}

.yb-menu__ja-related {
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding-left: 4px;
}

.yb-menu__ja-related a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--yb-gray);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-menu__ja-related a::before {
  content: "";
  width: 6px;
  height: 8px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/chevron-right.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-menu__ja-brand {
  width: min(49.382vw, 711px);
  flex: 0 1 min(49.382vw, 711px);
  min-width: 0;
}

.yb-menu__ja-brand img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
}

.yb-hero {
  position: relative;
  background: var(--yb-white);
}

.yb-hero__stage {
  position: relative;
  margin-bottom: 2px;
}

.yb-hero__sp-static {
  display: none;
}

.yb-hero__slides {
  position: relative;
  z-index: 0;
  contain: paint;
  isolation: isolate;
  height: calc(100svh - var(--yb-header) - var(--yb-home-strip-height));
  overflow: hidden;
  background: var(--yb-white);
  transform: translateZ(0);
}

.yb-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.7s ease;
}

.yb-hero__slide.is-active {
  opacity: 1;
}

.yb-hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-hero__layer-stack {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: var(--yb-kv-base-width, 1280px);
  aspect-ratio: 1440/900;
  transform: translate(-50%, -50%) scale(var(--yb-kv-scale, 1));
  transform-origin: center;
}

.yb-hero__layer-stack--over-yokobi {
  z-index: 3;
}

.yb-hero__layer {
  position: absolute;
  inset: 0;
  display: block;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: clip-path 1.2s cubic-bezier(0.65, 0, 0.35, 1), opacity 1.2s ease;
}

.yb-hero__layer.is-animating {
  will-change: clip-path, opacity;
}

.yb-hero__slide .yb-hero__layer {
  object-fit: fill;
}

.yb-hero__fixed-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: calc((100svh - var(--yb-header) - var(--yb-home-strip-height)) * 1440 / 900);
  height: 100%;
  pointer-events: none;
}

.yb-hero__fixed-frame--yokobi {
  z-index: 2;
}

.yb-hero__fixed-frame--text {
  z-index: 4;
}

.yb-hero__fixed-frame .yb-hero__fixed-layer,
.yb-fixed-bg__layer .yb-hero__fixed-layer {
  position: absolute;
  display: block;
  width: auto;
  max-width: none;
  clip-path: inset(0);
  object-fit: contain;
  pointer-events: none;
}

.yb-hero__fixed-frame .yb-hero__fixed-layer--yokobi,
.yb-fixed-bg__layer .yb-hero__fixed-layer--yokobi {
  top: 0;
  left: -4px;
  height: 96%;
  animation: yb-hero-fixed-yokobi-in 1.2s cubic-bezier(0.65, 0, 0.35, 1) 0.2s both;
}

.yb-hero__fixed-frame .yb-hero__fixed-layer--text {
  top: 13%;
  left: 15.2%;
  height: 27.7%;
  animation: yb-hero-fixed-text-in 1.05s cubic-bezier(0.65, 0, 0.35, 1) 0.65s both;
}

@keyframes yb-hero-fixed-yokobi-in {
  from {
    clip-path: inset(0 0 100% 0);
  }
  to {
    clip-path: inset(0);
  }
}
@keyframes yb-hero-fixed-text-in {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0);
  }
}
.yb-hero__layer--lr {
  clip-path: inset(0 100% 0 0);
}

.yb-hero__layer--rl {
  clip-path: inset(0 0 0 100%);
}

.yb-hero__layer--tb {
  clip-path: inset(0 0 100% 0);
}

.yb-hero__layer--bt {
  clip-path: inset(100% 0 0 0);
}

.yb-hero__layer--fill {
  clip-path: inset(0);
  opacity: 0;
  transition: opacity 1.2s ease;
}

.yb-hero__layer--fill.is-exiting {
  transition-duration: 0.42s;
  transition-timing-function: ease-out;
}

.yb-hero__layer.is-visible {
  clip-path: inset(0);
}

.yb-hero__layer--fill.is-visible {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .yb-hero__layer {
    transition-duration: 1ms;
  }
}
@property --yb-intro-sweep {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@property --yb-intro-radiation-hole {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
.yb-top-intro {
  --yb-top-intro-scale: 1;
  --yb-intro-pair-duration: 1.18s;
  --yb-intro-pair-stagger: 0.14s;
  --yb-intro-glyph-ease: cubic-bezier(0.33, 1, 0.68, 1);
  --yb-intro-glyph-flow-distance: 16px;
  --yb-intro-glyph-afterflow-distance: 8px;
  --yb-intro-glyph-blur-in: 0.7px;
  --yb-intro-glyph-blur-out: 0.35px;
  --yb-intro-scene-1-start: 0.22s;
  --yb-intro-scene-1-2-gap: -0.3s;
  --yb-intro-scene-2-3-gap: 0s;
  --yb-intro-scene-2-start: calc(var(--yb-intro-scene-1-start) + var(--yb-intro-pair-duration) + var(--yb-intro-scene-1-2-gap));
  --yb-intro-scene-3-start: calc(var(--yb-intro-scene-2-start) + var(--yb-intro-pair-duration) + var(--yb-intro-scene-2-3-gap));
  --yb-intro-scene-3-duration: 1.34s;
  --yb-intro-scene-3-stagger: 0.22s;
  --yb-intro-scene-4-gap: 0s;
  --yb-intro-core-start: calc(var(--yb-intro-scene-3-start) + var(--yb-intro-scene-3-duration) + var(--yb-intro-scene-4-gap));
  --yb-intro-core-duration: 4.16s;
  --yb-intro-edge-offset: 0.08s;
  --yb-intro-edge-start: calc(var(--yb-intro-core-start) + var(--yb-intro-edge-offset));
  --yb-intro-edge-duration: 3.64s;
  --yb-intro-direction-offset: 0.2s;
  --yb-intro-direction-start: calc(var(--yb-intro-core-start) + var(--yb-intro-direction-offset));
  --yb-intro-direction-duration: 0.82s;
  --yb-intro-radiation-offset: 0.6s;
  --yb-intro-radiation-start: calc(var(--yb-intro-core-start) + var(--yb-intro-radiation-offset));
  --yb-intro-radiation-duration: 2.18s;
  --yb-intro-parabola-offset: 0.78s;
  --yb-intro-parabola-start: calc(var(--yb-intro-core-start) + var(--yb-intro-parabola-offset));
  --yb-intro-parabola-duration: 1.48s;
  --yb-intro-exit-offset: 1.28s;
  --yb-intro-exit-start: calc(var(--yb-intro-core-start) + var(--yb-intro-exit-offset));
  --yb-intro-parabola-exit-duration: 1.04s;
  --yb-intro-radiation-exit-offset: 1.98s;
  --yb-intro-radiation-exit-start: calc(var(--yb-intro-core-start) + var(--yb-intro-radiation-exit-offset));
  --yb-intro-radiation-exit-duration: 2.52s;
  --yb-intro-radiation-exit-radius: 1900px;
  --yb-intro-mark-exit-duration: 1.52s;
  position: relative;
  width: 100%;
  height: 100svh;
  min-height: 620px;
  overflow: hidden;
  background: var(--yb-white);
  isolation: isolate;
}

.yb-top-intro.is-returning {
  --yb-intro-core-start: 0s;
}

.yb-top-intro.is-returning .yb-top-intro__scene--1,
.yb-top-intro.is-returning .yb-top-intro__scene--2,
.yb-top-intro.is-returning .yb-top-intro__scene--3 {
  display: none;
}

body.is-yb-top-intro-active {
  overflow: hidden;
}

.yb-home--with-intro > .yb-top-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  opacity: 1;
  transition: opacity 0.45s ease, visibility 0s linear 0.45s;
}

.yb-home--with-intro > .yb-top-intro.is-complete {
  opacity: 0;
  visibility: hidden;
}

.yb-home--with-intro:not(.is-yb-top-intro-complete) .yb-hero__fixed-layer--yokobi,
.yb-home--with-intro:not(.is-yb-top-intro-complete) .yb-hero__fixed-layer--text {
  animation-play-state: paused;
}

.yb-top-intro-plain {
  margin: 0;
  background: var(--yb-white);
}

.yb-top-intro__stage {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1436px;
  height: 894px;
  transform: translate(-50%, -50%) scale(var(--yb-top-intro-scale));
  transform-origin: center;
}

.yb-top-intro__scene,
.yb-top-intro__mark {
  position: absolute;
  inset: 0;
}

.yb-top-intro__mark {
  transform: translateX(0);
  transform-origin: center;
}

.yb-top-intro.is-playing .yb-top-intro__mark {
  animation: yb-top-intro-mark-exit var(--yb-intro-mark-exit-duration) cubic-bezier(0.65, 0, 0.35, 1) var(--yb-intro-exit-start) both;
}

.yb-top-intro__asset {
  display: block;
  max-width: none;
  pointer-events: none;
  user-select: none;
}

.yb-top-intro__asset--glyph,
.yb-top-intro__asset--core,
.yb-top-intro__asset--edge {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  opacity: 0;
}

.yb-top-intro__asset--glyph,
.yb-top-intro__asset--edge {
  transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
}

.yb-top-intro__asset--core {
  z-index: 4;
  transform: translate(-50%, -50%) translate(var(--intro-start-x), var(--intro-start-y));
}

.yb-top-intro__asset--edge {
  z-index: 4;
}

.yb-top-intro.is-playing .yb-top-intro__scene--1 .yb-top-intro__asset--glyph {
  animation: yb-top-intro-scene-pair var(--yb-intro-pair-duration) var(--yb-intro-glyph-ease) var(--yb-intro-scene-1-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--1 .yb-top-intro__asset--glyph:nth-child(1) {
  animation: yb-top-intro-scene-1-tate var(--yb-intro-pair-duration) var(--yb-intro-glyph-ease) var(--yb-intro-scene-1-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--1 .yb-top-intro__asset--glyph:nth-child(2) {
  animation: yb-top-intro-scene-1-yoko calc(var(--yb-intro-pair-duration) - var(--yb-intro-pair-stagger)) var(--yb-intro-glyph-ease) calc(var(--yb-intro-scene-1-start) + var(--yb-intro-pair-stagger)) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--2 .yb-top-intro__asset--glyph {
  animation: yb-top-intro-scene-pair var(--yb-intro-pair-duration) var(--yb-intro-glyph-ease) var(--yb-intro-scene-2-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--2 .yb-top-intro__asset--glyph:nth-child(1) {
  animation: yb-top-intro-scene-2-ji var(--yb-intro-pair-duration) var(--yb-intro-glyph-ease) var(--yb-intro-scene-2-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--2 .yb-top-intro__asset--glyph:nth-child(2) {
  animation: yb-top-intro-scene-2-zai calc(var(--yb-intro-pair-duration) - var(--yb-intro-pair-stagger)) var(--yb-intro-glyph-ease) calc(var(--yb-intro-scene-2-start) + var(--yb-intro-pair-stagger)) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--3 .yb-top-intro__asset--glyph {
  animation: yb-top-intro-scene-pair var(--yb-intro-scene-3-duration) var(--yb-intro-glyph-ease) var(--yb-intro-scene-3-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__scene--3 .yb-top-intro__asset--glyph:nth-child(2) {
  animation: yb-top-intro-scene-pair calc(var(--yb-intro-scene-3-duration) - var(--yb-intro-scene-3-stagger)) var(--yb-intro-glyph-ease) calc(var(--yb-intro-scene-3-start) + var(--yb-intro-scene-3-stagger)) both;
}

.yb-top-intro.is-playing .yb-top-intro__asset--core {
  animation: yb-top-intro-core-piece var(--yb-intro-core-duration) cubic-bezier(0.22, 1, 0.36, 1) var(--yb-intro-core-start) both;
}

.yb-top-intro.is-playing .yb-top-intro__asset--edge {
  animation: yb-top-intro-edge-piece var(--yb-intro-edge-duration) cubic-bezier(0.22, 1, 0.36, 1) var(--yb-intro-edge-start) both;
}

.yb-top-intro__asset--direction {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 324px;
  height: auto;
  opacity: 0;
  clip-path: circle(0 at 50% 50%);
  transform: translate(-50%, -50%);
}

.yb-top-intro.is-playing .yb-top-intro__asset--direction {
  animation: yb-top-intro-circle-reveal var(--yb-intro-direction-duration) cubic-bezier(0.55, 0, 0.45, 1) var(--yb-intro-direction-start) both;
}

.yb-top-intro__radiation-mask {
  --yb-intro-radiation-hole: 0px;
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: 3200px;
  height: 2000px;
  transform: translate(-50%, -50%);
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--yb-intro-radiation-hole), #000 calc(var(--yb-intro-radiation-hole) + 1px));
  mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--yb-intro-radiation-hole), #000 calc(var(--yb-intro-radiation-hole) + 1px));
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.yb-top-intro.is-playing .yb-top-intro__radiation-mask {
  animation: yb-top-intro-radiation-exit var(--yb-intro-radiation-exit-duration) ease var(--yb-intro-radiation-exit-start) forwards;
}

.yb-top-intro__asset--radiation {
  position: static;
  width: 100%;
  height: 100%;
  opacity: 0;
  clip-path: circle(0 at 50% 50%);
  object-fit: contain;
}

.yb-top-intro.is-playing .yb-top-intro__asset--radiation {
  animation: yb-top-intro-radiation-reveal var(--yb-intro-radiation-duration) cubic-bezier(0.16, 1, 0.3, 1) var(--yb-intro-radiation-start) both;
}

.yb-top-intro__parabola-mask {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  display: block;
  width: 1484px;
  height: 808px;
  opacity: 0;
  transform: translate(-50%, -50%);
  -webkit-mask-image: conic-gradient(from 0deg, transparent 0deg calc(360deg - var(--yb-intro-sweep)), #000 calc(360deg - var(--yb-intro-sweep)) 360deg);
  mask-image: conic-gradient(from 0deg, transparent 0deg calc(360deg - var(--yb-intro-sweep)), #000 calc(360deg - var(--yb-intro-sweep)) 360deg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.yb-top-intro__asset--parabola {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yb-top-intro.is-playing .yb-top-intro__parabola-mask {
  animation: yb-top-intro-parabola-reveal var(--yb-intro-parabola-duration) cubic-bezier(0.16, 1, 0.3, 1) var(--yb-intro-parabola-start) both, yb-top-intro-parabola-exit var(--yb-intro-parabola-exit-duration) ease var(--yb-intro-exit-start) forwards;
}

.yb-top-intro.is-complete {
  pointer-events: none;
}

@keyframes yb-top-intro-scene-pair {
  0% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-in));
  }
  34%, 72% {
    opacity: 1;
    filter: blur(0);
  }
  100% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-out));
  }
}
@keyframes yb-top-intro-scene-1-tate {
  0% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-in));
    transform: translate(-50%, -50%) translate(calc(var(--intro-x) - var(--yb-intro-glyph-flow-distance)), var(--intro-y));
  }
  60%, 72% {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
  }
  100% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-out));
    transform: translate(-50%, -50%) translate(calc(var(--intro-x) + var(--yb-intro-glyph-afterflow-distance)), var(--intro-y));
  }
}
@keyframes yb-top-intro-scene-1-yoko {
  0% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-in));
    transform: translate(-50%, -50%) translate(calc(var(--intro-x) - var(--yb-intro-glyph-flow-distance)), var(--intro-y));
  }
  56%, 70% {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
  }
  100% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-out));
    transform: translate(-50%, -50%) translate(calc(var(--intro-x) + var(--yb-intro-glyph-afterflow-distance)), var(--intro-y));
  }
}
@keyframes yb-top-intro-scene-2-ji {
  0% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-in));
    transform: translate(-50%, -50%) translate(var(--intro-x), calc(var(--intro-y) - var(--yb-intro-glyph-flow-distance)));
  }
  60%, 72% {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
  }
  100% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-out));
    transform: translate(-50%, -50%) translate(var(--intro-x), calc(var(--intro-y) + var(--yb-intro-glyph-afterflow-distance)));
  }
}
@keyframes yb-top-intro-scene-2-zai {
  0% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-in));
    transform: translate(-50%, -50%) translate(var(--intro-x), calc(var(--intro-y) - var(--yb-intro-glyph-flow-distance)));
  }
  56%, 70% {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
  }
  100% {
    opacity: 0;
    filter: blur(var(--yb-intro-glyph-blur-out));
    transform: translate(-50%, -50%) translate(var(--intro-x), calc(var(--intro-y) + var(--yb-intro-glyph-afterflow-distance)));
  }
}
@keyframes yb-top-intro-core-piece {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) translate(var(--intro-start-x), var(--intro-start-y));
  }
  28%, 100% {
    opacity: 1;
    transform: translate(-50%, -50%) translate(var(--intro-end-x), var(--intro-end-y));
  }
}
@keyframes yb-top-intro-edge-piece {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) translate(calc(var(--intro-x) + var(--intro-edge-push-x)), calc(var(--intro-y) + var(--intro-edge-push-y)));
  }
  26%, 100% {
    opacity: 1;
    transform: translate(-50%, -50%) translate(var(--intro-x), var(--intro-y));
  }
}
@keyframes yb-top-intro-circle-reveal {
  0% {
    opacity: 0;
    clip-path: circle(0 at 50% 50%);
  }
  18% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    clip-path: circle(78% at 50% 50%);
  }
}
@keyframes yb-top-intro-radiation-reveal {
  0% {
    opacity: 0;
    clip-path: circle(0 at 50% 50%);
  }
  10% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    clip-path: circle(1600px at 50% 50%);
  }
}
@keyframes yb-top-intro-radiation-exit {
  from {
    --yb-intro-radiation-hole: 0px;
  }
  to {
    --yb-intro-radiation-hole: var(--yb-intro-radiation-exit-radius);
  }
}
@keyframes yb-top-intro-parabola-reveal {
  0% {
    --yb-intro-sweep: 0deg;
    opacity: 0;
  }
  6% {
    opacity: 1;
  }
  100% {
    --yb-intro-sweep: 360deg;
    opacity: 1;
  }
}
@keyframes yb-top-intro-parabola-exit {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes yb-top-intro-mark-exit {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  32%, 64% {
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .yb-top-intro.is-playing .yb-top-intro__asset,
  .yb-top-intro.is-playing .yb-top-intro__mark,
  .yb-top-intro.is-playing .yb-top-intro__parabola-mask {
    animation-delay: 0ms !important;
    animation-duration: 1ms !important;
  }
}
.yb-hero__thumbs {
  position: relative;
  display: flex;
  gap: 2px;
  width: 486px;
  flex: 0 0 486px;
  height: 96px;
}

.yb-hero__thumb {
  position: relative;
  display: block;
  width: 160px;
  height: 96px;
  flex: 0 0 160px;
  overflow: hidden;
  cursor: pointer;
}

.yb-hero__thumb img {
  width: 160px;
  height: 90px;
  object-fit: cover;
}

.yb-hero__thumb::after {
  content: "";
  position: absolute;
  inset: 0 0 2px;
  background: rgba(255, 255, 255, 0);
  transition: background 0.2s ease;
}

.yb-hero__thumb.is-active::after {
  background: rgba(255, 255, 255, 0.7);
}

.yb-hero__thumb span {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: max(1px, min(0.2777777778vw, 2px));
  background: var(--yb-border);
}

.yb-hero__thumb span::before {
  content: "";
  display: block;
  width: calc(var(--yb-progress, 0) * 1%);
  height: 100%;
  background: var(--yb-blue);
}

.yb-hero__banners {
  position: relative;
  display: flex;
  gap: 2px;
  width: 486px;
  flex: 0 0 486px;
  height: 96px;
  margin-left: auto;
}

.yb-hero__banner {
  position: relative;
  display: block;
  width: 160px;
  height: 96px;
  flex: 0 0 160px;
  overflow: hidden;
}

.yb-hero__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.2s ease, opacity 0.2s ease;
}

.yb-hero__banner:is(:hover, :focus-visible) img {
  filter: brightness(1.12);
  opacity: 0.8;
}

.yb-hero__banner--placeholder {
  background: #d9d9d9;
}

.yb-home-strip {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  min-height: var(--yb-home-strip-height);
  background: var(--yb-white);
}

.yb-home-strip__news {
  display: flex;
  gap: 24px;
  flex: 1 1 auto;
  min-width: 0;
  height: 90px;
  padding: 24px 0 0 var(--yb-pad);
}

.yb-home-strip__news h2 {
  margin: 0;
  padding-right: 24px;
  border-right: 1px solid #959595;
  font-family: var(--yb-font-en);
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
}

.yb-home-strip__news ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(546px, 100%);
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-home-strip__news a {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  height: 16px;
  transition: color 0.18s ease;
}

.yb-home-strip__news time {
  flex: 0 0 auto;
  color: var(--yb-gray);
  font-family: var(--yb-font-en);
  font-size: 16px;
  line-height: 1;
  transition: color 0.18s ease;
}

.yb-home-strip__news span {
  min-width: 0;
  overflow: hidden;
  color: var(--yb-black);
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.18s ease;
}

.yb-home-strip__news a:is(:hover, :focus-visible) time,
.yb-home-strip__news a:is(:hover, :focus-visible) span {
  color: var(--yb-blue);
}

.yb-statement-vision {
  position: relative;
  width: 100%;
  min-height: calc(var(--yb-statement-panel-height) + var(--yb-statement-vision-height) + var(--yb-statement-scroll-distance));
  --yb-statement-panel-height: 800px;
  --yb-statement-vision-height: 800px;
  --yb-statement-scroll-distance: max(1440px, 180vh);
  --yb-statement-mark-progress: 0;
  --yb-statement-copy-y: 0px;
  --yb-statement-copy-opacity: 1;
}

.yb-statement-vision__sticky {
  position: sticky;
  top: 0;
}

.yb-statement-vision.is-yb-statement-complete {
  --yb-statement-mark-progress: 0;
  --yb-statement-copy-y: 0px;
  --yb-statement-copy-opacity: 1;
}

.yb-statement {
  position: relative;
  width: 100%;
  height: var(--yb-statement-panel-height);
  overflow: hidden;
  background-image: url("../img/top/statement-bg-pc.webp");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: cover;
}

.yb-statement__stage {
  position: relative;
  width: 100%;
  height: 100%;
}

.yb-statement__intro-base {
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 1;
  width: min(100%, 720px);
  aspect-ratio: 1;
  opacity: 0;
  transform: translateY(-50%) scale(1.04);
  transform-origin: center;
  transition: opacity 760ms ease, transform 1400ms cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.yb-statement__intro-base img {
  display: block;
  width: 100%;
  height: 100%;
}

.yb-statement__concept-mark {
  position: absolute;
  top: 45.025%;
  right: min(50%, 360px);
  z-index: 2;
  display: block;
  width: 300px;
  height: auto;
  opacity: 0;
  transform: translate(50%, -50%) scale(1);
  transform-origin: center;
  pointer-events: none;
}

.yb-statement__content {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  width: min(100%, 720px);
  height: 100%;
  transform: translate3d(0, 0, 0);
}

.yb-statement__text {
  position: absolute;
  left: 187.9048px;
  top: 180px;
  width: 344.1904px;
  height: 378.1424px;
}

.yb-statement__text-line {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
}

.yb-statement__text-line--1 {
  top: 0;
  width: 344.1904px;
}

.yb-statement__text-line--2 {
  top: 59.7736px;
  width: 280.4212px;
}

.yb-statement__text-line--3 {
  top: 118.9796px;
  width: 247.9356px;
}

.yb-statement__text-line--4 {
  top: 217.2968px;
  width: 310.1472px;
}

.yb-statement__text-line--5 {
  top: 315.7724px;
  width: 245.0844px;
}

.yb-statement__art-crossing {
  position: absolute;
  left: 373.4741px;
  top: 582px;
  width: 293.766px;
  mix-blend-mode: difference;
}

.yb-statement__text-line,
.yb-statement__art-crossing {
  display: block;
  height: auto;
}

.yb-statement.is-yb-statement-base-visible .yb-statement__intro-base {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}

.yb-statement-vision.is-yb-statement-complete .yb-statement__intro-base {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}

.yb-statement.is-yb-statement-scroll .yb-statement__concept-mark {
  opacity: var(--yb-statement-mark-progress);
  transform: translate(50%, -50%) scale(1);
}

.yb-statement.is-yb-statement-scroll .yb-statement__content {
  opacity: var(--yb-statement-copy-opacity);
  transform: translate3d(0, var(--yb-statement-copy-y), 0);
}

@media (prefers-reduced-motion: reduce) {
  .yb-statement-vision {
    min-height: 0;
  }
  .yb-statement-vision__sticky {
    position: relative;
  }
  .yb-statement__concept-mark {
    opacity: 0;
  }
}
.yb-split-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--yb-shell);
  align-items: stretch;
  background: transparent;
}

.yb-split-section__visual {
  min-height: 800px;
  background: transparent;
}

.yb-split-section__content {
  position: relative;
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  background: var(--yb-white);
}

.yb-vision__visual {
  position: relative;
  overflow: hidden;
  background-image: url("../img/top/vision-left-bg.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.yb-vision__visual-content {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: min(62%, 446px);
  height: auto;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.yb-vision__content {
  min-height: 800px;
  background-image: url("../img/top/vision-bg.webp");
  background-position: center center;
  background-size: cover;
}

.yb-vision__inner {
  position: relative;
  min-height: 800px;
  padding: 64px var(--yb-pad) 60px;
  color: var(--yb-white);
}

.yb-section-kicker {
  margin: 0 0 40px;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-vision h2 {
  display: inline-flex;
  align-items: center;
  margin: 0 0 8px;
  padding: 0 4px;
  background: var(--yb-white);
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.5;
}

.yb-vision p:not(.yb-section-kicker):not(.yb-vertical-label) {
  width: min(100%, 490px);
  margin: 0;
  font-size: 16px;
  letter-spacing: 0.025em;
  line-height: 1.7;
}

.yb-vision .yb-more-button {
  margin-top: 24px;
  border-color: var(--yb-white);
  color: var(--yb-blue);
  background: var(--yb-white);
}

.yb-vision__chart {
  display: block;
  width: 320px;
  margin: -33px auto 0 134px;
}

.yb-lottie-chart {
  position: relative;
  display: block;
}

.yb-lottie-chart svg,
.yb-lottie-chart__fallback {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yb-lottie-chart--top-vision {
  aspect-ratio: 360/320;
}

.yb-lottie-chart--value-cycle {
  aspect-ratio: 496/448;
}

.yb-lottie-chart.is-loading .yb-lottie-chart__fallback,
.yb-lottie-chart.is-loaded .yb-lottie-chart__fallback {
  display: none;
}

.yb-vertical-label {
  position: absolute;
  right: 9px;
  top: 50%;
  z-index: 1;
  margin: 0;
  transform: translateY(-50%);
  color: rgba(255, 255, 255, 0.76);
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 100;
  letter-spacing: 0.1em;
  line-height: 1;
  writing-mode: vertical-rl;
}

.yb-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding-top: 48px;
}

.yb-section-heading--stack {
  align-items: flex-start;
}

.yb-section-heading--stack > div {
  display: grid;
  gap: 11px;
}

.yb-section-heading--stack p {
  font-family: var(--yb-font-jp);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-section-heading h2 {
  margin: 0;
  font-family: var(--yb-font-en);
  font-size: 40px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}

.yb-section-heading p {
  margin: 0;
  font-family: var(--yb-font-en);
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
}

.yb-section-heading p span:first-child {
  font-weight: 500;
}

.yb-more-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-width: 118px;
  min-height: 34px;
  padding: 8px 22px;
  border: 1px solid var(--yb-black);
  border-radius: 25px;
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-more-button::after,
.yb-pill-button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

a.yb-more-button:hover,
a.yb-more-button:focus-visible {
  border-color: var(--yb-blue);
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-courses__visual {
  background: transparent;
}

.yb-courses__inner {
  padding: 64px 0 32px;
}

.yb-course-intro {
  display: grid;
  gap: 32px;
  padding-inline: var(--yb-pad);
}

.yb-course-intro__heading {
  display: flex;
  align-items: center;
  gap: 24px;
  height: 24px;
}

.yb-course-intro__heading h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-course-intro__heading span {
  display: block;
  flex: 1 1 auto;
  height: 1px;
  min-width: 0;
  background: var(--yb-line);
}

.yb-course-intro__heading p {
  margin: 0;
  color: #656464;
  font-family: var(--yb-font-en);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.yb-course-intro__body {
  display: grid;
  gap: 24px;
  width: min(100%, 600px);
}

.yb-course-intro__body p {
  margin: 0;
  font-size: 16px;
  letter-spacing: 0.025em;
  line-height: 1.7;
}

.yb-primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: fit-content;
  min-height: 48px;
  padding: 8px 24px;
  border-radius: 24px;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-primary-button,
.yb-pill-button {
  color: var(--yb-white);
}

.yb-primary-button::after,
.yb-pill-button::after {
  background-color: currentColor;
}

.yb-pill-button::before {
  background-color: var(--yb-icon-color);
}

.yb-primary-button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-white.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-course-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: 24px;
}

.yb-course-card {
  --yb-course-card-photo-left: 48px;
  --yb-course-card-photo-top: 48px;
  --yb-course-card-photo-width: 264px;
  --yb-course-card-photo-height: 384px;
  --yb-course-card-photo-hover-left: 36px;
  --yb-course-card-photo-hover-top: 36px;
  --yb-course-card-photo-hover-width: 288px;
  --yb-course-card-photo-hover-height: 408px;
  position: relative;
  display: block;
  aspect-ratio: 360/480;
  min-height: 0;
  overflow: hidden;
  border-right: 1px solid #f0f2f4;
  border-bottom: 1px solid #f0f2f4;
  background: var(--yb-white);
}
.yb-course-card:last-child, .yb-course-card:nth-last-child(2) {
  border-bottom: 0;
}

.yb-course-card img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
}

.yb-course-card .yb-course-card__base {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.yb-course-card__highlight {
  position: absolute;
  left: 6.666667%;
  top: 0;
  z-index: 1;
  display: block;
  width: 86.666667%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.24s ease;
}

.yb-course-card .yb-course-card__photo {
  position: absolute;
  left: var(--yb-course-card-photo-left);
  top: var(--yb-course-card-photo-top);
  z-index: 2;
  width: var(--yb-course-card-photo-width);
  height: var(--yb-course-card-photo-height);
  transition: left 0.24s ease, top 0.24s ease, width 0.24s ease, height 0.24s ease;
}

.yb-course-card__en {
  position: absolute;
  right: 48px;
  bottom: 48px;
  z-index: 3;
  display: block;
  color: var(--yb-course-card-color);
  mix-blend-mode: difference;
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 100;
  letter-spacing: 0;
  line-height: 0.9;
  text-align: right;
  transform: rotate(90deg);
  transform-origin: right bottom;
  transition: opacity 0.18s ease;
}

.yb-course-card--split:hover .yb-course-card__highlight,
.yb-course-card--split:focus-visible .yb-course-card__highlight {
  opacity: 1;
}

.yb-course-card--split:hover .yb-course-card__photo,
.yb-course-card--split:focus-visible .yb-course-card__photo {
  left: var(--yb-course-card-photo-hover-left);
  top: var(--yb-course-card-photo-hover-top);
  width: var(--yb-course-card-photo-hover-width);
  height: var(--yb-course-card-photo-hover-height);
}

.yb-course-card--split:hover .yb-course-card__en,
.yb-course-card--split:focus-visible .yb-course-card__en {
  opacity: 0;
}

.yb-senpai__content {
  background-image: url("../img/top/senpai-bg.webp");
  background-position: center top;
  background-size: cover;
}

.yb-senpai__inner {
  min-height: 1320px;
  padding-top: 64px;
  padding-bottom: 72px;
  padding-inline: 0;
}

.yb-senpai-carousel {
  --yb-senpai-drag-x: 0px;
  position: relative;
  height: 760px;
  width: 656px;
  max-width: 100%;
  margin: 0 auto;
  touch-action: pan-y;
}

.yb-senpai-carousel__title {
  position: absolute;
  left: 50%;
  top: 24px;
  z-index: 5;
  display: block;
  width: 445px;
  height: 64px;
  margin: 0;
  transform: translateX(-50%);
}

.yb-senpai-carousel__title-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  height: 100%;
  padding: 10px 24px 10px 48px;
  border: 1px solid var(--yb-black);
  border-radius: 32px;
  background: var(--yb-white);
  color: var(--yb-blue);
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.yb-senpai-carousel__title-text {
  font-family: var(--yb-font-jp);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 1.2px;
  line-height: 1;
  white-space: nowrap;
}

.yb-senpai-carousel__title-en {
  font-family: var(--yb-font-en);
  font-size: 26px;
  font-weight: 700;
}

.yb-senpai-carousel__title-link::after {
  content: "";
  display: inline-block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask-image: url("../img/common/arrow-blue.svg");
  mask-image: url("../img/common/arrow-blue.svg");
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.yb-senpai-carousel__title-link:hover,
.yb-senpai-carousel__title-link:focus-visible {
  background: var(--yb-blue);
  border-color: var(--yb-blue);
  color: var(--yb-white);
}

.yb-senpai-card {
  position: absolute;
  top: 0;
  display: block;
  width: 360px;
  height: 760px;
  border: max(1px, min(0.1388888889vw, 1px)) solid var(--yb-black);
  border-radius: 180px;
  background: var(--senpai-tint);
  color: var(--yb-black);
  overflow: hidden;
  -webkit-user-drag: none;
  user-select: none;
  transform-origin: left top;
  backface-visibility: hidden;
  transition: left 0.55s cubic-bezier(0.22, 1, 0.36, 1), top 0.55s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease, visibility 0.35s ease, transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: left, top, transform, opacity;
}

.yb-senpai-card img {
  -webkit-user-drag: none;
  user-select: none;
}

.yb-senpai-card--left {
  left: 0;
  top: 76px;
  z-index: 1;
  transform: scale(0.8);
}

.yb-senpai-card--right {
  left: 368px;
  right: auto;
  top: 76px;
  z-index: 1;
  transform: scale(0.8);
}

.yb-senpai-card--center {
  left: 148px;
  top: 0;
  z-index: 3;
  transform: translate3d(var(--yb-senpai-drag-x), 0, 0) scale(1);
}

.yb-senpai-card:nth-of-type(n+4) {
  left: 148px;
  right: auto;
  top: 0;
  z-index: 0;
  transform: scale(0.9);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.yb-senpai-card--hidden {
  left: 148px;
  right: auto;
  top: 0;
  z-index: 0;
  transform: scale(0.9);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.yb-senpai-carousel.is-dragging .yb-senpai-card {
  transition: none;
}

.yb-senpai-card__course {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.yb-senpai-card__label {
  position: absolute;
  top: 76px;
  left: 0;
  z-index: 2;
  width: 100%;
  height: auto;
  pointer-events: none;
}

.yb-senpai-card__photo {
  position: absolute;
  left: 50%;
  top: 136px;
  width: 230px;
  height: 230px;
  margin: 0;
  overflow: hidden;
  border-radius: 50%;
  background: var(--yb-white);
  box-shadow: 0 0 0 4px var(--yb-white), 0 0 0 5px var(--yb-black);
  transform: translateX(-50%);
}

.yb-senpai-card__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-senpai-card__name {
  position: absolute;
  left: 50%;
  top: 392px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  width: auto;
  min-width: 206px;
  min-height: 36px;
  margin: 0;
  padding: 8px 16px;
  border-radius: 18px;
  transform: translateX(-50%);
  background: var(--yb-white);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.yb-senpai-card__name span {
  line-height: 1.25;
}

.yb-senpai-card__name small {
  font-size: 12px;
  font-weight: 400;
}

.yb-senpai-card__message {
  position: absolute;
  top: 452px;
  display: grid;
  gap: 0;
  width: 100%;
  margin: 0;
  padding: 8px;
  font-family: var(--yb-font-hand);
  font-size: 28px;
  font-weight: 300;
  line-height: 1.6;
  text-align: center;
}

.yb-senpai-card__message span {
  display: block;
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: var(--senpai-color);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.yb-senpai-card__more {
  position: absolute;
  left: 50%;
  bottom: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 118px;
  min-height: 44px;
  padding: 8px 18px;
  border: max(1px, min(0.1388888889vw, 1px)) solid var(--yb-black);
  border-radius: 25px;
  transform: translateX(-50%);
  background: var(--senpai-color);
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-senpai-card__more::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background: var(--yb-black);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-senpai-card:hover .yb-senpai-card__more,
.yb-senpai-card:focus-visible .yb-senpai-card__more {
  border-color: var(--senpai-color);
  background: var(--senpai-soft);
  color: var(--senpai-color);
}

.yb-senpai-card:hover .yb-senpai-card__more::after,
.yb-senpai-card:focus-visible .yb-senpai-card__more::after {
  background: currentColor;
}

.yb-senpai__movie {
  position: relative;
  width: 640px;
  height: 360px;
  margin-top: 64px;
  margin-left: auto;
  margin-right: auto;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: #111;
  clip-path: polygon(32px 0, 100% 0, 100% calc(100% - 32px), calc(100% - 32px) 100%, 0 100%, 0 32px);
}

.yb-senpai__movie iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.yb-info__visual {
  background: transparent;
}

.yb-info__content {
  background: var(--yb-white);
}

.yb-panel-section {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  border-bottom: 1px solid var(--yb-border);
  background: var(--yb-white);
}

.yb-panel-section .yb-shell {
  margin-left: 0;
}

.yb-scroll-list {
  display: flex;
  gap: 32px;
  width: calc(100% + var(--yb-pad) * 2);
  margin-top: 24px;
  margin-left: calc(var(--yb-pad) * -1);
  margin-right: calc(var(--yb-pad) * -1);
  padding: 0 var(--yb-pad) 64px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
  touch-action: pan-x pan-y;
}

.yb-scroll-list.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  user-select: none;
}

.yb-scroll-list.is-inertia {
  scroll-behavior: auto;
}

.yb-scroll-list.is-dragging a {
  pointer-events: none;
}

.yb-scroll-list::-webkit-scrollbar {
  display: none;
}

.yb-card,
.yb-exam-card {
  width: 272px;
  flex: 0 0 272px;
}

.yb-card__image {
  position: relative;
  width: 272px;
  height: 204px;
  margin: 0;
  overflow: hidden;
}

.yb-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-card__image span {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  width: 56px;
  height: 56px;
  padding: 0 4px 0 0;
  background: linear-gradient(135deg, transparent 0 50%, var(--yb-white) 50% 100%);
  font-family: var(--yb-font-en);
  font-size: 22px;
  font-weight: 500;
  line-height: 1;
}

.yb-card__body,
.yb-exam-card__body {
  display: grid;
  gap: 12px;
  padding: 24px 2px 0;
}

.yb-card__body h3,
.yb-exam-card__body h3 {
  display: -webkit-box;
  min-height: 54px;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.5;
}

.yb-card__body p,
.yb-exam-card__body p {
  display: -webkit-box;
  height: 44px;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.025em;
  line-height: 1.6;
}

.yb-exam-card__body p {
  display: flex;
  align-items: center;
  gap: 16px;
  height: auto;
  color: var(--yb-black);
  line-height: 1;
}

.yb-exam-card__body p::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  min-height: 24px;
  padding: 5px 12px;
  border: 1px solid var(--yb-gray);
  border-radius: 4px;
  color: var(--yb-gray);
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.yb-home-news {
  border-bottom: 0;
}

.yb-news-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding-left: 0;
  list-style: none;
  padding-top: 24px;
  padding-bottom: 64px;
}

.yb-news-list--page {
  padding-top: 0;
  padding-bottom: 0;
}

.yb-news-item {
  border-bottom: 1px solid var(--yb-line);
}

.yb-news-item a {
  display: grid;
  gap: 8px;
  padding: 24px 4px;
}

.yb-news-item__meta {
  display: flex;
  align-items: center;
  gap: 32px;
}

.yb-news-item time {
  font-family: var(--yb-font-en);
  font-size: 20px;
  line-height: 1;
}

.yb-news-item h3 {
  margin: 0;
  color: #171818;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.5;
}

.yb-lower-page {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  background: var(--yb-white);
}

.yb-lower-page__inner {
  display: flex;
  flex-direction: column;
  gap: 64px;
  padding: 40px 0 96px;
}

.yb-page-heading {
  width: 100%;
  padding: 0 46px;
}

.yb-page-heading h1,
.yb-page-heading > p {
  margin: 0;
}

.yb-page-heading h1 {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-page-heading > p {
  margin-top: 12px;
  padding-left: 2px;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}
.yb-page-heading > p:first-child {
  margin-top: 0;
}
.yb-page-heading > p + h1 {
  margin-top: 8px;
}

.yb-page-heading--index {
  padding: 0 46px;
}

.yb-page-heading--index h1 {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-page-heading--index > p {
  color: var(--yb-blue);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.yb-page-heading--level-2 h1,
.yb-page-heading--level-3 h1 {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.35;
}

.yb-page-heading--level-2 > p,
.yb-page-heading--level-3 > p {
  color: var(--yb-black);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.yb-page-heading__description {
  width: 576px;
  max-width: 100%;
  margin-top: 16px;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

.yb-page-heading__description p {
  margin: 0;
}

.yb-president-message__lead {
  position: relative;
  width: 576px;
  margin: 0 auto;
  padding: 24px;
  border: max(1px, min(0.2777777778vw, 2px)) solid var(--yb-blue);
  color: var(--yb-blue);
  clip-path: polygon(24px 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%, 0 24px);
}
.yb-president-message__lead::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border: 1.5px solid var(--yb-blue);
  width: 1px;
  height: 24px;
  transform: skew(-45deg) translateX(-4px);
  transform-origin: left bottom;
}
.yb-president-message__lead::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  border: 1.5px solid var(--yb-blue);
  width: 1px;
  height: 24px;
  transform: skew(-45deg) translateX(4px);
  transform-origin: left top;
}

.yb-president-message__lead-inner {
  position: relative;
  display: flex;
  min-height: 240px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 48px;
  padding: 32px 42px 24px;
}

.yb-president-message__corner {
  position: absolute;
  z-index: 1;
  width: 13px;
  height: 13px;
  background-image: url("../img/about/message/yb-president-message__corner.svg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

.yb-president-message__corner--tl {
  left: 24px;
  top: 24px;
}

.yb-president-message__corner--tr {
  right: 24px;
  top: 24px;
  transform: rotate(90deg);
}

.yb-president-message__corner--bl {
  left: 24px;
  bottom: 24px;
  transform: rotate(270deg);
}

.yb-president-message__corner--br {
  right: 24px;
  bottom: 24px;
  transform: rotate(180deg);
}

.yb-president-message__statement {
  width: 395px;
  margin: 0;
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.5;
}

.yb-president-message__statement span {
  display: block;
}

.yb-president-message__name {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  width: 395px;
  margin: 0;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1;
  white-space: nowrap;
}

.yb-president-message__name strong {
  font-weight: 650;
}

.yb-president-message__body {
  display: grid;
  gap: 24px;
  width: 576px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-president-message__body p {
  margin: 0;
}

.yb-president-message__profile {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 32px;
  width: 576px;
  margin: 0 auto;
  padding-top: 32px;
  border-top: 1px solid var(--yb-blue);
}

.yb-president-message__profile p,
.yb-president-message__profile h2 {
  margin: 0;
}

.yb-president-message__profile-name {
  display: grid;
  gap: 12px;
  align-content: start;
  padding-top: 6px;
  white-space: nowrap;
}

.yb-president-message__profile-name p {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-president-message__profile-name h2 {
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-president-message__profile > p {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-lower-nav {
  width: 100%;
  border-top: 1px solid var(--yb-border);
  border-bottom: 1px solid var(--yb-border);
  background: var(--yb-white);
  position: relative;
  z-index: 1;
}

.yb-lower-nav a {
  text-decoration: none;
  white-space: nowrap;
}

.yb-lower-nav__back {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  padding: 12px var(--yb-pad);
  background: var(--yb-border);
}

.yb-lower-nav__back a {
  --yb-back-icon-color: currentColor;
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 40px;
  color: var(--yb-gray);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  transition: color 0.18s ease;
}

.yb-lower-nav__back a::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  background-color: var(--yb-back-icon-color);
  mask-image: url("../img/common/arrow-back.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-lower-nav__back a:hover,
.yb-lower-nav__back a:focus-visible {
  --yb-back-icon-color: var(--yb-blue);
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-lower-nav__meta {
  display: flex;
  align-items: center;
  gap: 48px;
  min-height: 46px;
  padding: 8px var(--yb-pad);
}

.yb-lower-breadcrumb {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  margin-bottom: -0.2em;
  padding: 0 0 0.2em;
  overflow-x: auto;
  overflow-y: hidden;
  list-style: none;
}

.yb-lower-breadcrumb li {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
  color: var(--yb-gray);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-lower-breadcrumb a {
  color: inherit;
  text-decoration-color: var(--yb-gray);
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  transition: color 0.18s ease;
}

.yb-lower-breadcrumb a:hover,
.yb-lower-breadcrumb a:focus-visible {
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-lower-breadcrumb li + li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  background-color: #70777C;
  mask-image: url("../img/common/chevron-right.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-lower-breadcrumb [aria-current=page] {
  color: var(--yb-blue);
}

body.page-template-page-about_message .yb-footer-nav {
  display: none;
}

body.page-template-page-department .yb-footer-nav {
  display: none;
}

body.page-template-page-department_paint .yb-footer-nav {
  display: none;
}

.yb-department-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
  background-size: cover;
}

.yb-department-index__fixed-content {
  width: min(80%, 576px);
  max-width: 576px;
}

.yb-president-message__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-about-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-access__fixed-bg .yb-fixed-bg__layer {
  background-position: left center;
}

.yb-access__heading {
  padding-bottom: 0;
}

.yb-access__heading .yb-page-heading__description {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0;
  line-height: 1.7;
}

.yb-access .yb-section-title {
  font-size: 22px;
  letter-spacing: 0.1em;
}

.yb-access .yb-section-title::before {
  height: auto;
}

.yb-access__section {
  gap: 32px;
}

.yb-access__location,
.yb-access__route-map,
.yb-access__block,
.yb-access__bus-info,
.yb-access__hotel {
  display: grid;
  gap: 24px;
}

.yb-access__location {
  gap: 0;
}

.yb-access__location .yb-map-frame--google {
  margin-top: 32px;
  height: 468px;
}

.yb-access__location-lead {
  margin-top: 24px;
}

.yb-access__location-lead p,
.yb-access__bus-lead p,
.yb-access__hotel-lead p {
  padding-right: 0;
}

.yb-page-section.yb-access__section--traffic {
  gap: 0;
}

.yb-access__section--traffic > .yb-access__route-map {
  margin-top: 32px;
}

.yb-access__section--traffic > .yb-access__block {
  margin-top: 72px;
}

.yb-access__route-map {
  gap: 16px;
}

.yb-access__sublead {
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-access__route-map .yb-map-frame {
  height: 371.696px;
}

.yb-access__block {
  gap: 24px;
}

.yb-access__block--bus {
  gap: 0;
}

.yb-map-frame.yb-access__bus-map {
  margin-top: 16px;
  height: 456.768px;
}

.yb-access__bus-info {
  gap: 0;
  margin-top: 32px;
}

.yb-access__bus-info .yb-route-steps--panels {
  margin-top: 12px;
}

.yb-access__bus-info .yb-section-lead {
  gap: 10px;
  margin-top: 16px;
}

.yb-access__bus-info .yb-page-more-button {
  margin-top: 10px;
}

.yb-access__hotel {
  gap: 0;
}

.yb-access__hotel-lead {
  margin-top: 16px;
}

.yb-access__hotel .yb-info-panel {
  margin-top: 24px;
}

.yb-contact__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-contact__heading {
  padding-bottom: 0;
}

.yb-contact__heading .yb-page-heading__description {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0;
  line-height: 1.7;
}

.yb-contact__heading > p {
  color: var(--yb-blue);
}

.yb-contact__section {
  gap: 0 !important;
}

.yb-contact__heading + .yb-contact__section {
  padding-top: 0;
}

.yb-contact-directory {
  display: grid;
  gap: 48px;
  margin-top: 32px;
}

.yb-contact-lead-card {
  width: 100%;
  padding: 12px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 12px/1px calc(100% - 24px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 12px/1px calc(100% - 24px) no-repeat;
}

.yb-contact-lead-card__body {
  display: grid;
  gap: 16px;
  padding: 24px 32px;
  border-radius: 8px;
  background: #d9edf7;
}

.yb-contact-lead-card h3 {
  margin: 0 0 8px;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contact-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 20px;
  margin: 0;
}

.yb-contact-meta__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 18px;
  padding: 4px;
  border: 1px solid var(--yb-black);
  border-radius: 4px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-contact-meta--lead .yb-contact-meta__label {
  min-width: 52px;
  height: 24px;
}

.yb-contact-meta__value {
  margin: 0;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.yb-contact-meta--tel .yb-contact-meta__value {
  color: var(--yb-blue);
  font-size: 32px;
  letter-spacing: 0.02em;
}

.yb-contact-meta--fax .yb-contact-meta__value,
.yb-contact-meta--email .yb-contact-meta__value {
  font-size: 22px;
}

.yb-contact-meta--address .yb-contact-meta__label {
  margin-top: 2px;
  font-family: var(--yb-font-jp);
}

.yb-contact-meta--address .yb-contact-meta__value {
  font-family: var(--yb-font-jp);
  font-size: 20px;
  letter-spacing: 0.05em;
  white-space: normal;
}

.yb-primary-button--arrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.yb-primary-button--arrow::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-white.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-contact-lead-card__button {
  justify-self: stretch;
  margin-top: 16px;
}

.yb-contact-lead-card__button span {
  flex: 1 1 auto;
  justify-content: flex-start;
}

.yb-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px 32px;
}

.yb-contact-card {
  padding: 24px 2px 0;
  border-top: 1px solid var(--yb-line);
}
.yb-contact-card:nth-child(1), .yb-contact-card:nth-child(2) {
  padding-top: 8px;
  border-top: none;
}

.yb-contact-card__text {
  display: grid;
  gap: 8px;
}

.yb-contact-card h3,
.yb-contact-card p {
  margin: 0;
}

.yb-contact-card h3 {
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contact-card__text p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-contact-card__meta {
  display: grid;
  gap: 8px;
  margin-top: 24px;
}

.yb-contact-card__actions {
  display: grid;
  gap: 16px;
  margin-top: 16px;
  justify-items: start;
}

.yb-contact-card--meta-offset .yb-contact-card__meta {
  margin-top: 48px;
}

.yb-contact-form-page__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-contact-form-page__heading {
  padding-bottom: 0;
}

.yb-contact-form-page__section {
  gap: 0 !important;
  padding-top: 0 !important;
}

.yb-contact-form-progress {
  display: flex;
  align-items: stretch;
  width: 624px;
  max-width: 100%;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

.yb-contact-form-progress__item {
  position: relative;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 4px;
  min-height: 60px;
  padding: 10px 16px;
  background: #dfe1e0;
  color: #474b4e;
  text-align: center;
}

.yb-contact-form-progress__item:nth-child(1),
.yb-contact-form-progress__item:nth-child(2) {
  width: 210px;
}

.yb-contact-form-progress__item:nth-child(3) {
  width: 204px;
}

.yb-contact-form-progress__item > span,
.yb-contact-form-progress__item > strong {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}

.yb-contact-form-progress__item > span {
  font-family: var(--yb-font-en);
  letter-spacing: 0.05em;
}

.yb-contact-form-progress__item > strong {
  letter-spacing: 0.1em;
}

.yb-contact-form-progress__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: -33px;
  width: 33px;
  height: 100%;
  background: inherit;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  z-index: 1;
}

.yb-contact-form-progress__item.is-done {
  background: #80d0f4;
  color: var(--yb-white);
}

.yb-contact-form-progress__item.is-current {
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-contact-form {
  display: grid;
  gap: 0;
  padding: 0;
}

.yb-contact-form-field {
  display: grid;
  gap: 16px;
}

.yb-contact-form-field__head {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.yb-contact-form-field__title-wrap {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.yb-contact-form-field__accent {
  display: inline-block;
  width: 4px;
  height: 24px;
  margin-top: 1px;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-contact-form-field__title {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-contact-form-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 6px 12px;
  border-radius: 2px;
  background: #e8528e;
  color: var(--yb-white);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1;
  white-space: nowrap;
}

.yb-contact-form-tag.is-optional {
  border: 1px solid var(--yb-black);
  background: var(--yb-white);
  color: var(--yb-black);
}

.yb-contact-form-field__body {
  display: grid;
  gap: 12px;
  padding-bottom: 48px;
}

.yb-contact-form-field__body--split {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  width: 624px;
  max-width: 100%;
}

.yb-contact-form-split-item,
.yb-donation-form-split-item {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.yb-contact-form-split-item.is-invalid .yb-contact-form-error,
.yb-donation-form-split-item.is-invalid .yb-contact-form-error {
  display: flex;
}

.yb-contact-form-split-item.is-invalid .yb-contact-form-control,
.yb-donation-form-split-item.is-invalid .yb-contact-form-control {
  border-color: #e34876;
  background: #fff7fa;
}

.yb-contact-form-split-item .yb-contact-form-control,
.yb-donation-form-split-item .yb-contact-form-control {
  width: 100%;
  max-width: 100%;
}

.yb-contact-form-control {
  width: 624px;
  max-width: 100%;
  min-height: 54px;
  padding: 12px 24px;
  border: 1px solid #a6a6a7;
  background: var(--yb-white);
  color: #131313;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-contact-form-control::placeholder {
  color: #d0c5c9;
}

.yb-contact-form-control:focus-visible {
  outline: 0;
  border-color: var(--yb-blue);
}

.yb-donation-form-amount {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  max-width: 100%;
}

.yb-donation-form-amount .yb-contact-form-control {
  width: 560px;
}

.yb-donation-form-amount > span {
  color: #131313;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

textarea.yb-contact-form-control {
  min-height: 190px;
  resize: vertical;
}

.yb-contact-form-error {
  display: none;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #e8528e;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contact-form-error::before {
  content: "!";
  display: inline-block;
  width: 20px;
  height: 20px;
  color: transparent;
  background-image: url("../img/common/icon-exclamation.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.yb-contact-form-field.is-invalid .yb-contact-form-error {
  display: inline-flex;
}

.yb-contact-form-field.is-invalid .yb-contact-form-control {
  border-color: #e8528e;
  background: #fdedf3;
}

.yb-contact-form-field__body--choices {
  padding-bottom: 48px;
}

.yb-contact-form-choice-list {
  display: grid;
  gap: 16px;
  width: 100%;
  max-width: 624px;
}

.yb-contact-form-choice {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #131313;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.025em;
  line-height: 1;
  white-space: nowrap;
}

.yb-contact-form-choice input {
  appearance: none;
  position: relative;
  width: 28px;
  height: 28px;
  margin: 0;
  border: 1px solid #a6a6a7;
  border-radius: 50%;
  background: var(--yb-white);
  flex: 0 0 auto;
}

.yb-contact-form-choice input:checked::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #131313;
}

.yb-contact-form-privacy-text {
  display: grid;
  gap: 8px;
  color: #131313;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-contact-form-privacy-text p {
  margin: 0;
}

.yb-contact-form-field__body--privacy {
  padding-bottom: 0;
}

.yb-contact-form-privacy-check {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 624px;
  min-height: 86px;
  padding: 24px;
  border: 1px solid #a6a6a7;
  background: var(--yb-white);
  color: #131313;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.025em;
  line-height: 1;
}

.yb-contact-form-privacy-check input {
  appearance: none;
  position: relative;
  width: 28px;
  height: 28px;
  margin: 0;
  border: 1px solid #a6a6a7;
  border-radius: 50%;
  background: var(--yb-white);
  flex: 0 0 auto;
}

.yb-contact-form-privacy-check input:checked::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #131313;
}

.yb-contact-form-field--privacy.is-invalid .yb-contact-form-privacy-check {
  border: max(1px, 2px) solid #e8528e;
  background: #fdedf3;
}

.yb-contact-form-submit {
  width: 100%;
  margin-top: 72px;
}

.yb-consultation-cf7 {
  width: 100%;
}

.yb-consultation-cf7 .wpcf7,
.yb-consultation-cf7 .wpcf7-form,
.yb-consultation-cf7 .form-01 {
  width: 100%;
}

.yb-consultation-cf7 .wpcf7-form,
.yb-consultation-cf7 .form-01 {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
}

.yb-consultation-cf7 .screen-reader-response,
.yb-consultation-cf7 .form-current-01,
.yb-consultation-cf7 .p-country-name,
.yb-consultation-cf7 input[type=hidden] {
  display: none !important;
}

.yb-consultation-cf7 .form-item,
.yb-consultation-cf7 .form-notice {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0 0 48px;
  border: 0;
}

.yb-consultation-cf7 .form-item dt,
.yb-consultation-cf7 .form-notice dt,
.yb-consultation-cf7 .form-apply-title dt {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.35;
}

.yb-consultation-cf7 .form-item dt::before,
.yb-consultation-cf7 .form-notice dt::before,
.yb-consultation-cf7 .form-apply-title dt::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 24px;
  margin-top: 0;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-consultation-cf7 .form-apply-title {
  margin: 0 0 32px;
  padding: 0;
}

.yb-consultation-cf7 .form-apply-title .ul-annotation-01 {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0;
  color: #474b4e;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
  list-style: none;
}

.yb-consultation-cf7 .form-apply-title .ul-annotation-01 li {
  margin: 0 !important;
  padding-left: 1.25em;
  text-indent: -1.25em;
}

.yb-consultation-cf7 .form-required,
.yb-consultation-cf7 .form-any {
  order: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  margin: 0 0 0 12px;
  padding: 6px 12px;
  border-radius: 2px;
  background: #e8528e;
  color: var(--yb-white);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1;
  white-space: nowrap;
}

.yb-consultation-cf7 .form-any {
  border: 1px solid var(--yb-black);
  background: var(--yb-white);
  color: var(--yb-black);
}

.yb-consultation-cf7 .text-sub {
  align-self: center;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.yb-consultation-cf7 .form-item dd,
.yb-consultation-cf7 .form-notice dd {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
}

.yb-consultation-cf7 .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  max-width: 624px;
}

.yb-consultation-cf7 input:not([type=hidden]):not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]),
.yb-consultation-cf7 select,
.yb-consultation-cf7 textarea {
  width: 624px;
  max-width: 100%;
  min-height: 54px;
  padding: 12px 24px;
  border: 1px solid #a6a6a7;
  border-radius: 0;
  background-color: var(--yb-white);
  color: #131313;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-consultation-cf7 input::placeholder,
.yb-consultation-cf7 textarea::placeholder {
  color: #d0c5c9;
}

.yb-consultation-cf7 input:focus-visible,
.yb-consultation-cf7 select:focus-visible,
.yb-consultation-cf7 textarea:focus-visible {
  outline: 0;
  border-color: var(--yb-blue);
}

.yb-consultation-cf7 input.v-small,
.yb-consultation-cf7 .v-small input {
  width: 300px;
}

.yb-consultation-cf7 input.v-mini,
.yb-consultation-cf7 .v-mini input:not([type=hidden]):not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]) {
  width: 96px;
  padding-right: 14px;
  padding-left: 14px;
}

.yb-consultation-cf7 textarea {
  min-height: 190px;
  resize: vertical;
}

.yb-consultation-cf7 .form-column-01 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  width: 624px;
  max-width: 100%;
}

.yb-consultation-cf7 .form-column-01 > div {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.yb-consultation-cf7 .form-column-01 .wpcf7-form-control-wrap,
.yb-consultation-cf7 .form-column-01 input:not([type=hidden]):not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]) {
  width: 100%;
  max-width: 100%;
}

.yb-consultation-cf7 .form-column-01 .confirm-value {
  width: 100%;
}

.yb-consultation-cf7 .form-column-02 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  width: 624px;
  max-width: 100%;
  color: #474b4e;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-consultation-cf7 .form-column-02 > div {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.yb-consultation-cf7 .form-column-02.block {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.yb-consultation-cf7 .form-column-02 .wpcf7-form-control-wrap {
  width: auto;
  max-width: 100%;
}

.yb-consultation-cf7 .form-column-02 .v-mini .wpcf7-form-control-wrap {
  width: 96px;
}

.yb-consultation-cf7 .form-column-02 input:not([type=hidden]):not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]),
.yb-consultation-cf7 .form-column-02 select {
  max-width: 100%;
}

.yb-school-visit-form-cf7 .form-column-02.block .wpcf7-form-control-wrap,
.yb-school-visit-form-cf7 .form-column-02.block select {
  width: 100%;
}

.yb-school-visit-form-cf7 .form-column-01:has(> div:only-child) {
  grid-template-columns: minmax(0, 1fr);
}

.yb-school-visit-form-cf7 .confirm-indent {
  margin-top: 8px;
}

.yb-school-visit-form-cf7 .mb-12 {
  margin-bottom: 12px;
}

.yb-consultation-cf7 .form-heading {
  margin: 16px 0 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
}

.yb-consultation-cf7 .form-heading--email-confirm {
  letter-spacing: 0.02em;
  line-height: 1.5;
}

.yb-consultation-cf7 .form-select-01 {
  position: relative;
  width: 624px;
  max-width: 100%;
}

.yb-consultation-cf7 .form-select-01::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  width: 10px;
  height: 10px;
  border-right: 1px solid #131313;
  border-bottom: 1px solid #131313;
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}

.yb-consultation-cf7 .wpcf7-form.is-confirm .form-select-01::after,
.yb-consultation-cf7 .form-select-01.is-confirm::after {
  content: none;
  display: none;
}

.yb-consultation-cf7 .form-select-01 select {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  padding-right: 56px;
  background-image: none;
}

.yb-consultation-cf7 .form-select-01 select::-ms-expand {
  display: none;
}

.yb-consultation-cf7 .form-radio-01 .wpcf7-form-control,
.yb-consultation-cf7 .form-checkbox-01 .wpcf7-form-control {
  display: grid;
  gap: 16px;
}

.yb-consultation-cf7 .form-radio-01 .wpcf7-form-control {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 32px;
}

.yb-consultation-cf7 .form-radio-01 input[type=text] {
  margin-top: 8px;
}

.yb-consultation-cf7 .wpcf7-list-item {
  display: block;
  margin: 0;
}

.yb-consultation-cf7 .wpcf7-list-item label,
.yb-consultation-cf7 .form-agreement label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #131313;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.025em;
  line-height: 1.5;
}

.yb-consultation-cf7 input[type=radio],
.yb-consultation-cf7 input[type=checkbox] {
  appearance: none;
  position: relative;
  width: 28px;
  height: 28px;
  margin: 0;
  border: 1px solid #a6a6a7;
  border-radius: 50%;
  background: var(--yb-white);
  flex: 0 0 auto;
}

.yb-consultation-cf7 input[type=radio]:checked::after,
.yb-consultation-cf7 input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #131313;
}

.yb-consultation-cf7 .form-notice {
  padding-bottom: 24px;
}

.yb-consultation-cf7 .form-notice dd {
  display: block;
  color: #131313;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-consultation-cf7 .form-agreement {
  width: 100%;
  max-width: 624px;
  margin: 0;
  padding: 24px;
  border: 1px solid #a6a6a7;
  background: var(--yb-white);
}

.yb-consultation-cf7 .form-agreement label {
  width: 100%;
}

.yb-consultation-cf7 .form-agreement .wpcf7-form-control-wrap {
  width: auto;
}

.yb-consultation-cf7 .form-btn {
  display: grid;
  gap: 24px;
  width: 100%;
  margin: 72px 0 0;
  padding: 0;
}

.yb-consultation-cf7 .form-btn > div {
  width: 100%;
  margin: 0;
}

.yb-consultation-cf7 .confirm_button,
.yb-consultation-cf7 .form-btn-submit input,
.yb-consultation-cf7 .btn-01 input,
.yb-consultation-cf7 .btn-01 button {
  width: 100%;
  min-height: 60px;
  padding: 10px 56px 10px 32px;
  border: 0;
  border-radius: 30px;
  background-color: var(--yb-blue);
  background-image: url("../img/common/arrow-white.svg");
  background-position: right 24px center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  color: var(--yb-white);
  cursor: pointer;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
}

.yb-consultation-cf7 .back_button,
.yb-consultation-cf7 .btn-02 input,
.yb-consultation-cf7 .btn-02 button {
  width: 100%;
  min-height: 60px;
  padding: 10px 32px;
  border: 1px solid #a6a6a7;
  border-radius: 30px;
  background: var(--yb-white);
  color: var(--yb-black);
  cursor: pointer;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
}

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

.yb-consultation-cf7 .confirm-value {
  display: flex;
  align-items: center;
  width: 624px;
  max-width: 100%;
  min-height: 54px;
  margin: 0;
  padding: 12px 24px;
  border: 1px solid #a6a6a7;
  background-color: #f0f2f4;
  color: #131313;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
  white-space: pre-wrap;
}

.yb-consultation-cf7 .confirm-value.v-small,
.yb-consultation-cf7 .v-small .confirm-value {
  width: 300px;
}

.yb-consultation-cf7 .confirm-value.v-mini,
.yb-consultation-cf7 .v-mini .confirm-value {
  width: 96px;
}

.yb-consultation-cf7 .wpcf7-form.is-confirm .form-notice,
.yb-consultation-cf7 .wpcf7-form.is-confirm .form-agreement,
.yb-consultation-cf7 .wpcf7-form.is-confirm .form-radio-01 .wpcf7-list-item,
.yb-consultation-cf7 .wpcf7-form.is-confirm .form-checkbox-01 .wpcf7-list-item {
  display: none;
}

.yb-consultation-cf7 .wpcf7-not-valid-tip,
.yb-consultation-cf7 .error-message {
  display: block;
  margin: 8px 0 0;
  color: #e8528e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-consultation-cf7 [aria-invalid=true] {
  border-color: #e8528e !important;
  background-color: #fdedf3 !important;
}

.yb-consultation-cf7 .wpcf7-response-output {
  margin: 32px 0 0 !important;
  padding: 16px 20px !important;
  border: 1px solid #e8528e !important;
  color: #e8528e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-consultation-cf7 .wpcf7-response-output:empty,
.yb-consultation-cf7 .wpcf7-response-output[aria-hidden=true] {
  display: none;
}

.yb-contact-form-field--confirm .yb-contact-form-field__body {
  padding-bottom: 48px;
}

.yb-contact-form-control--static {
  display: flex;
  align-items: center;
  margin: 0;
  background: #f0f2f4;
}

.yb-contact-form-control--static.is-multiline {
  align-items: flex-start;
  white-space: pre-wrap;
}

.yb-contact-form-actions {
  display: grid;
  gap: 24px;
}

.yb-contact-form-actions .yb-contact-form-actions__back {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 60px;
  padding: 10px 32px;
  border-color: var(--yb-black);
  border-radius: 30px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-contact-form-actions .yb-contact-form-actions__back::after {
  order: -1;
  width: 16px;
  height: 16px;
  transform: rotate(180deg);
}

.yb-contact-form-actions__submit {
  width: 100%;
}

.yb-contact-cf7-proxy {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  border: 0;
}

.yb-contact-complete-frame {
  width: 100%;
  padding: 12px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 12px/1px calc(100% - 24px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 12px/1px calc(100% - 24px) no-repeat;
}

.yb-contact-complete-frame__body {
  display: grid;
  gap: 32px;
  padding: 32px;
  border-radius: 8px;
  background: #e6f6fd;
}

.yb-contact-complete-frame__body h2 {
  margin: 0;
  color: var(--yb-blue);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
}

.yb-contact-complete-frame__text,
.yb-contact-complete-frame__cautions {
  display: grid;
  gap: 0;
}

.yb-contact-complete-frame__text p,
.yb-contact-complete-frame__cautions p {
  margin: 0;
  color: #131313;
  text-align: center;
}

.yb-contact-complete-frame__text p {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-contact-complete-frame__cautions p {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
  text-align: left;
}

.yb-not-found__inner {
  gap: 64px;
  padding: 40px 0 96px;
}

.yb-not-found__section {
  width: 100%;
  padding: 0 var(--yb-pad) 16px;
}

.yb-not-found-card__body {
  align-items: center;
}

.yb-not-found-card__title {
  margin: 0;
  color: var(--yb-blue);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
}

.yb-not-found-card__message {
  display: grid;
  gap: 16px;
  width: 100%;
  color: var(--yb-black);
  font-size: 16px;
  font-feature-settings: "palt" 1;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
  text-align: center;
}

.yb-not-found-card__message p {
  margin: 0;
}

.yb-not-found-search {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 4px;
  width: 236px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--yb-blue);
  margin: auto;
}

.yb-not-found-search__submit,
.yb-not-found-search__reset {
  position: relative;
  display: block;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--yb-blue);
  cursor: pointer;
}

.yb-not-found-search__submit::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  mask-image: url("../img/common/icon-search.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-not-found-search__reset {
  color: #858b8e;
}

.yb-not-found-search__reset::before,
.yb-not-found-search__reset::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 1px;
  background: currentColor;
  transform-origin: center;
}

.yb-not-found-search__reset::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.yb-not-found-search__reset::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.yb-not-found-search__input {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.yb-not-found-search__input::placeholder {
  color: #858b8e;
  opacity: 1;
}

.yb-not-found-search__input:focus {
  outline: 0;
}

.yb-search-results__inner {
  gap: 24px;
  padding: 40px 0 96px;
}

.yb-search-results__heading {
  padding-bottom: 16px;
}

.yb-search-results__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0.04em;
}

.yb-search-results__section {
  width: 100%;
  padding: 24px var(--yb-pad) 16px;
}

.yb-search-results__list {
  display: grid;
  gap: 32px;
}

.yb-search-result-card {
  display: grid;
  gap: 4px;
}

.yb-search-result-card__title {
  margin: 0;
}

.yb-search-result-card__title a {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  align-items: start;
  gap: 4px;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
  text-decoration: underline;
}

.yb-search-result-card__title a::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--yb-blue);
}

.yb-search-result-card__excerpt,
.yb-search-results__empty {
  margin: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.7;
}

.yb-search-result-card__excerpt {
  display: -webkit-box;
  overflow: hidden;
  padding-left: 2px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.yb-search-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 32px;
  margin-top: 48px;
  padding: 0 128px;
}

.yb-search-pagination__pages {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-search-pagination .page-numbers,
.yb-search-pagination__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
  text-decoration: none;
}

.yb-search-pagination .page-numbers.current {
  border-radius: 50%;
  background: var(--yb-black);
  color: var(--yb-white);
}

.yb-search-pagination .page-numbers.dots {
  min-width: 18px;
}

.yb-search-pagination__arrow::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 16px 16px;
}

.yb-search-pagination__arrow--prev::before {
  transform: rotate(180deg);
}

.yb-search-pagination__arrow.is-disabled {
  opacity: 0.25;
  pointer-events: none;
}

@media (max-width: 900px) {
  .yb-contact-form-progress,
  .yb-contact-form,
  .yb-contact-form-field,
  .yb-contact-form-field__body,
  .yb-contact-form-control,
  .yb-contact-form-field__body--split,
  .yb-contact-form-field--confirm .yb-contact-form-field__body,
  .yb-contact-form-control--static {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .yb-contact-form-field__body--split {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .yb-contact-form,
  .yb-contact-form-field {
    grid-template-columns: minmax(0, 1fr);
  }
  .yb-search-pagination {
    gap: 16px;
    padding: 0;
  }
  .yb-search-pagination__pages {
    gap: 8px;
    min-width: 0;
    overflow-x: auto;
  }
}
.yb-contact-form-page .yb-contact-complete-back {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 60px;
  margin-top: 40px;
  padding: 10px 32px;
  border-color: var(--yb-black);
  border-radius: 30px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-contact-form-page .yb-contact-complete-back::after {
  order: -1;
  width: 16px;
  height: 16px;
  transform: rotate(180deg);
}

.yb-page-section {
  display: grid;
  gap: 24px;
  padding: 24px var(--yb-pad) 16px;
}
.yb-page-section:last-child:not(.yb-value-section--interview) {
  padding-bottom: 0;
}

.yb-page-section--callout {
  padding-top: 0;
}

.yb-section-title {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-left: 16px;
  margin: 0;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
}

.yb-section-title::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 4px;
  height: auto;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-section-title--plain {
  padding-left: 0;
}

.yb-section-title--plain::before {
  display: none;
}

.yb-subsection-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-subsection-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 24px;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
  padding-top: 16px;
}

.yb-link-list {
  display: grid;
  gap: 32px;
  padding-top: 16px;
}

.yb-link-list .yb-text-link,
.yb-link-grid .yb-text-link {
  position: relative;
  text-decoration-line: none;
  transition: border-color 0.18s ease, color 0.18s ease;
}

.yb-link-list .yb-text-link::before,
.yb-link-grid .yb-text-link::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--yb-link-hover);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.28s ease;
}

.yb-link-list .yb-page-index__link::before,
.yb-link-grid .yb-page-index__link::before {
  background: var(--yb-blue);
}

.yb-link-list .yb-text-link:hover,
.yb-link-list .yb-text-link:focus-visible,
.yb-link-grid .yb-text-link:hover,
.yb-link-grid .yb-text-link:focus-visible {
  --yb-text-link-icon-color: var(--yb-link-hover);
  border-bottom-color: var(--yb-link-hover);
  color: var(--yb-black);
  text-decoration-line: none;
}

.yb-link-list .yb-text-link--wide:hover,
.yb-link-list .yb-text-link--wide:focus-visible,
.yb-link-grid .yb-text-link--wide:hover,
.yb-link-grid .yb-text-link--wide:focus-visible {
  color: #474b4e;
}

.yb-link-list .yb-page-index__link:hover,
.yb-link-list .yb-page-index__link:focus-visible,
.yb-link-grid .yb-page-index__link:hover,
.yb-link-grid .yb-page-index__link:focus-visible {
  --yb-text-link-icon-color: var(--yb-blue);
  --yb-page-index-icon-color: var(--yb-blue);
  border-bottom-color: var(--yb-blue);
  color: var(--yb-black);
}

.yb-link-list .yb-text-link:hover::before,
.yb-link-list .yb-text-link:focus-visible::before,
.yb-link-grid .yb-text-link:hover::before,
.yb-link-grid .yb-text-link:focus-visible::before {
  transform: scaleX(1);
}

.yb-link-list--page-nav .yb-text-link::after {
  transform: rotate(90deg);
}

.yb-section-lead {
  display: grid;
  gap: 16px;
}

.yb-section-lead p {
  margin: 0;
  padding: 0 24px 0 2px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-section-lead a {
  color: var(--yb-gray);
  text-decoration: underline;
  text-decoration-color: #858b8e;
  text-underline-offset: 0.14em;
}

.yb-subject-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #33b3ed;
}

.yb-subject-table__group,
.yb-subject-table__category,
.yb-subject-table__content {
  padding: 14px 16px;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-align: left;
  vertical-align: middle;
}

.yb-subject-table__group {
  width: 32px;
  min-width: 32px;
  padding: 0 8px;
  background: #33b3ed;
  color: #ffffff;
  writing-mode: vertical-rl;
  text-orientation: upright;
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-align: center;
}

.yb-subject-table__group--divider {
  border-bottom: 1px solid #ffffff;
}

.yb-subject-table__category {
  width: 158px;
  min-width: 158px;
  border-bottom: 1px solid #ffffff;
  background: #bfe7f9;
  color: #474b4e;
  white-space: normal;
}

.yb-subject-table__content {
  padding-right: 14px;
  border-bottom: 1px solid #33b3ed;
  background: #ffffff;
  color: #474b4e;
  font-feature-settings: "palt" 1;
}

.yb-subject-table__row--group-end .yb-subject-table__category {
  border-bottom-color: #33b3ed;
}

.yb-subject-table__row:last-child .yb-subject-table__category,
.yb-subject-table__row:last-child .yb-subject-table__content {
  border-bottom: 0;
}

.yb-subject-table__row--short .yb-subject-table__category,
.yb-subject-table__row--short .yb-subject-table__content {
  min-height: 50px;
}

.yb-subject-table__row--medium .yb-subject-table__category,
.yb-subject-table__row--medium .yb-subject-table__content {
  min-height: 72px;
}

.yb-subject-table__row--tall .yb-subject-table__category,
.yb-subject-table__row--tall .yb-subject-table__content {
  min-height: 116px;
}

.yb-subject-table__row--x-tall .yb-subject-table__category,
.yb-subject-table__row--x-tall .yb-subject-table__content {
  min-height: 160px;
}

.yb-place-info {
  display: grid;
  gap: 12px;
  color: var(--yb-black);
  line-height: 1;
}

.yb-place-info p {
  margin: 0;
}

.yb-place-info__name {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-place-info__address {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.yb-place-info .yb-page-more-button {
  margin-top: 4px;
}

.yb-map-frame {
  position: relative;
  width: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--yb-blue-05);
}

.yb-map-frame img,
.yb-map-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.yb-map-frame img {
  object-fit: cover;
}

.yb-route-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 304px));
  gap: 40px 16px;
}

.yb-route-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding-left: 16px;
  border-left: max(1px, 2px) solid var(--yb-blue);
}

.yb-route-card--wide {
  grid-column: 1/-1;
}

.yb-route-card h4,
.yb-access__bus-info h4 {
  margin: 0;
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-route-steps {
  display: flex;
  align-items: center;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.5;
  list-style: none;
}

.yb-route-steps li {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  white-space: nowrap;
}

.yb-route-steps li + li::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 20px;
  flex: 0 0 auto;
  margin: 0 8px;
  background-image: url("../img/common/arrow-blue.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.yb-route-steps--access li + li::before {
  background-image: url("../img/access/arrow-access.svg");
}

.yb-route-steps--panels {
  align-items: stretch;
  width: 100%;
}

.yb-route-steps--panels li {
  flex: 1 1 0;
  justify-content: center;
  min-height: 87px;
  padding: 12px 16px;
  border-radius: 8px;
  background: var(--yb-blue-05);
  text-align: center;
  white-space: normal;
}

.yb-route-steps--panels li + li::before {
  width: 48px;
  margin: 0;
}

.yb-route-steps--access-bus li + li::before {
  position: absolute;
  left: -48px;
  top: 50%;
  background-image: url("../img/access/arrow-access-long.svg");
  transform: translateY(-50%);
}

.yb-route-steps--access-bus {
  gap: 48px;
}

.yb-route-steps--access-bus li {
  position: relative;
  width: 288px;
  flex: 0 0 288px;
  justify-content: center;
  text-align: left;
}

.yb-info-panel {
  display: grid;
  gap: 8px;
  padding: 24px;
  border-radius: 8px;
  background: var(--yb-blue-05);
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-info-panel p {
  margin: 0;
}

.yb-info-panel__name {
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: 500;
}

.yb-info-panel .yb-page-more-button {
  margin-top: 8px;
}

.yb-text-link {
  --yb-text-link-icon-color: currentColor;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 26px;
  padding: 0 2px 8px 1px;
  border-bottom: 1px solid var(--yb-line);
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  transition: color 0.18s ease;
}

.yb-text-link--wide {
  color: #474b4e;
  font-size: 16px;
  font-weight: 500;
}

.yb-text-link span {
  display: inline-flex;
  align-items: center;
}

.yb-text-link small {
  font: inherit;
  font-weight: 400;
}

.yb-text-link__external {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 8px;
  vertical-align: text-bottom;
  background-color: #6B7175;
  mask-image: url("../img/common/icon-blank.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-text-link::after,
.yb-index-card h3::after,
.yb-index-card__button::after {
  content: "";
  display: inline-flex;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  background-color: var(--yb-text-link-icon-color, currentColor);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-text-link:hover,
.yb-text-link:focus-visible {
  --yb-text-link-icon-color: var(--yb-blue);
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 296px));
  gap: 48px 32px;
  align-items: start;
}

.yb-index-card {
  min-width: 0;
}

.yb-index-card > a {
  display: flex;
  flex-direction: column;
  gap: 24px;
  height: 100%;
}

.yb-index-card__image {
  position: relative;
  width: 100%;
  height: 222px;
  margin: 0;
  overflow: hidden;
  background: #f0f2f4;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%);
}

.yb-index-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-index-card__body {
  display: grid;
  gap: 24px;
  align-content: start;
  padding: 0 2px;
}

.yb-index-card__text {
  display: grid;
  gap: 16px;
}

.yb-index-card h3 {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-index-card:not(.yb-index-card--featured) h3 {
  justify-content: space-between;
}

.yb-index-card h3 small {
  font: inherit;
  font-weight: 400;
}

.yb-index-card--featured h3::after {
  display: none;
}

.yb-index-card--featured h3 {
  display: block;
  line-height: 1.25;
}

.yb-index-card--featured .yb-index-card__text {
  gap: 12px;
}

.yb-career-index__heading + .yb-career-index__section {
  padding-top: 0;
}

.yb-index-card__description {
  display: grid;
  gap: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-index-card__description p {
  margin: 0;
}

.yb-index-card__button {
  --yb-text-link-icon-color: currentColor;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 32px;
  padding: 7px 24px;
  border: 1px solid var(--yb-black);
  border-radius: 25px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-index-card__button:hover,
.yb-index-card__button:focus-visible {
  --yb-text-link-icon-color: var(--yb-white);
  border-color: var(--yb-blue);
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-index-card__button--external::after {
  background-image: none;
  background-color: currentColor;
  mask-image: url("../img/common/icon-blank.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-index-card--compact .yb-index-card__body {
  gap: 16px;
}

.yb-index-card--flat-image .yb-index-card__image {
  clip-path: none;
}

.yb-index-card--text-only > a {
  gap: 0;
}

.yb-index-card--text-only .yb-index-card__body {
  gap: 24px;
}

.yb-index-card--static {
  display: grid;
  gap: 24px;
}

.yb-index-card--static h3::after {
  display: none;
}

.yb-teacher-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-teacher-card {
  min-width: 0;
}

.yb-teacher-card a {
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  align-content: start;
  min-height: 100%;
}

.yb-teacher-card img {
  display: block;
  width: 100%;
  height: 120px;
  background: #f0f2f4;
  object-fit: cover;
}

.yb-teacher-card__name {
  margin-top: 24px;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1.2;
}

.yb-teacher-card__en {
  margin-top: 8px;
  color: #474b4e;
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-teacher-card__position {
  margin-top: 16px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 150;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-teacher-table {
  overflow: hidden;
  border: 1px solid var(--teacher-list-color, var(--yb-border));
  border-radius: 8px;
}

.yb-teacher-table h3 {
  margin: 0;
  padding: 16px 24px;
  background: var(--teacher-list-tint, #f0f2f4);
  color: var(--teacher-list-color, var(--yb-gray));
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-teacher-table__body table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
}

.yb-teacher-table__body caption,
.yb-teacher-table__body thead {
  display: none;
}

.yb-teacher-table__body th,
.yb-teacher-table__body td {
  padding: 12px 16px 12px 24px !important;
  border-top: 1px solid var(--yb-border);
  color: #474b4e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.4;
  text-align: left;
}

.yb-teacher-table__body tr:first-child th,
.yb-teacher-table__body tr:first-child td {
  border-top: 0;
}

.yb-teacher-table__fallback {
  display: grid;
}

.yb-teacher-table__fallback div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 12px 24px;
  border-top: 1px solid var(--yb-border);
}

.yb-teacher-table__fallback div:first-child {
  border-top: 0;
}

.yb-teacher-table__fallback p {
  margin: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.4;
}

.yb-post-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 296px));
  column-gap: 32px;
  --yb-post-card-line: #f0f2f4;
}

.yb-post-card-list {
  display: grid;
  gap: 0;
}

.yb-post-card {
  position: relative;
  min-width: 0;
  padding-bottom: 32px;
}

.yb-post-card--static {
  display: grid;
  gap: 24px;
}

.yb-post-card-grid .yb-post-card:nth-child(n+3) {
  padding-top: 16px;
}

.yb-post-card-grid .yb-post-card:nth-child(odd)::after {
  content: "";
  position: absolute;
  bottom: -20px;
  left: 0;
  width: calc(200% + 32px);
  height: 1px;
  background: var(--yb-post-card-line);
}

.yb-post-card-grid .yb-post-card:last-child:nth-child(odd)::after {
  width: calc(100% + 16px);
}

.yb-post-card-grid .yb-post-card:nth-child(odd)::before {
  content: "";
  position: absolute;
  top: 0;
  right: -16px;
  bottom: 0;
  width: 1px;
  background: var(--yb-post-card-line);
}

.yb-post-card-list .yb-post-card {
  border-bottom: 1px solid #f0f2f4;
}

.yb-post-card-list--single .yb-post-card {
  border-bottom: 0;
}

.yb-post-card a {
  display: grid;
  gap: 24px;
  height: 100%;
}

.yb-post-card--horizontal a {
  grid-template-columns: 296px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.yb-post-card__image {
  position: relative;
  width: 100%;
  height: 222px;
  margin: 0;
  overflow: hidden;
  background: #f0f2f4;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%);
}

.yb-post-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-post-card__body {
  display: grid;
  gap: 16px;
  align-content: start;
  padding: 0 2px;
}

.yb-post-card--horizontal .yb-post-card__body {
  padding-top: 0;
}

.yb-post-card h3 {
  display: -webkit-box;
  min-height: 81px;
  margin: 0;
  overflow: hidden;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.yb-society-pas-gallery .yb-post-card h3 {
  min-height: auto;
}

.yb-post-card--horizontal h3 {
  min-height: 0;
}

.yb-post-card__body p {
  display: -webkit-box;
  min-height: 72px;
  margin: 0;
  overflow: hidden;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.yb-post-card time {
  color: #474b4e;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-news-fixed-bg .yb-fixed-bg__layer {
  background-color: #f0f2f4;
  background-position: center center;
}

.yb-news-index__inner {
  gap: 56px;
}

.yb-news-filter {
  display: grid;
  gap: 12px;
  width: 576px;
  max-width: 100%;
  margin-top: 24px;
}

.yb-news-filter__label {
  margin: 0;
  color: var(--yb-gray);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
}

.yb-news-filter__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-news-filter__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 8px 14px;
  border: 1px solid var(--yb-border);
  border-radius: 999px;
  background: var(--yb-white);
  color: #2f3336;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1;
  transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.yb-news-filter__link:hover,
.yb-news-filter__link:focus-visible,
.yb-news-filter__link.is-current {
  border-color: var(--yb-blue);
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-news-card-grid {
  grid-template-columns: repeat(2, minmax(0, 300px));
  gap: 40px;
  padding-inline: 40px;
}

.yb-news-card {
  padding-bottom: 0;
}

.yb-news-card .yb-post-card__image {
  height: 222px;
  clip-path: none;
}

.yb-news-card__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: #878787;
}

.yb-news-card__body {
  gap: 6px;
  padding: 8px 10px 0;
}

.yb-news-card__meta {
  order: 3;
}

.yb-news-card h2 {
  display: -webkit-box;
  min-height: 45px;
  margin: 0;
  overflow: hidden;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.yb-news-card__body p {
  display: -webkit-box;
  min-height: 42px;
  margin: 0;
  overflow: hidden;
  color: #231815;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.yb-news-card time {
  color: #231815;
  font-family: var(--yb-font-jp);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-news-index__empty {
  width: 624px;
  max-width: calc(100% - 96px);
  margin: 0 auto;
  color: #2f3336;
  font-size: 14px;
  line-height: 1.6;
}

.yb-news-pagination {
  display: flex;
  justify-content: center;
  padding-top: 8px;
}

.yb-news-pagination ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-news-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
}

.yb-news-pagination .page-numbers.current {
  border-radius: 50%;
  background: var(--yb-black);
  color: var(--yb-white);
}

.yb-news-pagination .prev,
.yb-news-pagination .next {
  min-width: 28px;
  color: var(--yb-black);
}

.yb-news-pagination .prev::before,
.yb-news-pagination .next::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 16px 16px;
}

.yb-news-pagination .prev::before {
  transform: rotate(180deg);
}

.yb-news-detail__inner {
  gap: 48px;
}

.yb-news-detail__article-head {
  display: grid;
  gap: 20px;
  padding-inline: 48px;
}

.yb-news-detail__meta {
  display: flex;
  align-items: center;
  gap: 24px;
}

.yb-news-detail__meta time {
  color: #231815;
  font-family: var(--yb-font-jp);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-news-detail__article-head h2 {
  width: 624px;
  max-width: 100%;
  margin: 0;
  color: var(--yb-black);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.6;
}

.yb-news-detail__main-image,
.yb-news-detail__slider,
.yb-news-detail__info {
  width: 680px;
  max-width: calc(100% - 96px);
  margin: 0 auto;
}

.yb-news-detail__main-image {
  background: #878787;
}

.yb-news-detail__main-image img,
.yb-news-detail__slider img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-news-detail__slider {
  position: relative;
}

.yb-news-detail__slider .swiper {
  width: 100%;
  overflow: hidden;
}

.yb-news-detail__slider .swiper-wrapper {
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-news-detail__slider .swiper-slide {
  list-style: none;
}

.yb-news-detail__slider .swiper-slide::before {
  content: none;
}

.yb-news-detail__slider figure {
  width: 100%;
  margin: 0;
}

.yb-news-detail__slider .swiper-caption,
.yb-news-detail__content figcaption,
.yb-news-detail__content .wp-caption-text {
  margin-top: 8px;
  color: #2f3336;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-news-detail__slider-button {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin: 0;
  border: 1px solid var(--yb-border);
  border-radius: 50%;
  background: var(--yb-white);
  color: var(--yb-black);
  transform: translateY(-50%);
}

.yb-news-detail__slider-button::after {
  content: "";
  width: 24px;
  height: 24px;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 16px 16px;
}

.yb-news-detail__slider-button--prev {
  left: -10px;
}

.yb-news-detail__slider-button--prev::after {
  transform: rotate(180deg);
}

.yb-news-detail__slider-button--next {
  right: -10px;
}

.yb-news-detail__sdgs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  width: 624px;
  max-width: calc(100% - 96px);
  margin: 0 auto;
}

.yb-news-detail__sdgs dt,
.yb-news-detail__sdgs dd {
  margin: 0;
}

.yb-news-detail__sdgs dt img {
  display: block;
  width: 160px;
  height: auto;
}

.yb-news-detail__sdgs dd img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.yb-news-detail__content {
  display: grid;
  gap: 24px;
  width: 624px;
  max-width: calc(100% - 96px);
  margin: 0 auto;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

.yb-news-detail__content > *,
.yb-news-detail__content > .wrap > * {
  min-width: 0;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

.yb-news-detail__content > .wrap {
  display: grid;
  gap: 24px;
  width: 100%;
  min-width: 0;
}

.yb-news-detail__content > p,
.yb-news-detail__content > h2,
.yb-news-detail__content > h3,
.yb-news-detail__content > h4,
.yb-news-detail__content > h5,
.yb-news-detail__content > h6,
.yb-news-detail__content > ul,
.yb-news-detail__content > ol,
.yb-news-detail__content > blockquote,
.yb-news-detail__content > .heading-02,
.yb-news-detail__content > .heading-03,
.yb-news-detail__content > .text-01,
.yb-news-detail__content > .text-bold-01,
.yb-news-detail__content > .list-01,
.yb-news-detail__content > .list-02,
.yb-news-detail__content > .ul-01,
.yb-news-detail__content > .ol-01,
.yb-news-detail__content > .ul-annotation-01,
.yb-news-detail__content > .dl-01,
.yb-news-detail__content > .btn-02,
.yb-news-detail__content > .link-square-01,
.yb-news-detail__content > .link-circle-01,
.yb-news-detail__content > .wrap > p,
.yb-news-detail__content > .wrap > h2,
.yb-news-detail__content > .wrap > h3,
.yb-news-detail__content > .wrap > h4,
.yb-news-detail__content > .wrap > h5,
.yb-news-detail__content > .wrap > h6,
.yb-news-detail__content > .wrap > ul,
.yb-news-detail__content > .wrap > ol,
.yb-news-detail__content > .wrap > blockquote,
.yb-news-detail__content > .wrap > .heading-02,
.yb-news-detail__content > .wrap > .heading-03,
.yb-news-detail__content > .wrap > .text-01,
.yb-news-detail__content > .wrap > .text-bold-01,
.yb-news-detail__content > .wrap > .list-01,
.yb-news-detail__content > .wrap > .list-02,
.yb-news-detail__content > .wrap > .ul-01,
.yb-news-detail__content > .wrap > .ol-01,
.yb-news-detail__content > .wrap > .ul-annotation-01,
.yb-news-detail__content > .wrap > .dl-01,
.yb-news-detail__content > .wrap > .btn-02,
.yb-news-detail__content > .wrap > .link-square-01,
.yb-news-detail__content > .wrap > .link-circle-01 {
  width: 624px;
  max-width: 100%;
  margin: 0 auto;
}

.yb-news-detail__content > figure,
.yb-news-detail__content > .wp-block-image,
.yb-news-detail__content > .wp-block-gallery,
.yb-news-detail__content > .gallery,
.yb-news-detail__content > .wp-block-table,
.yb-news-detail__content > .table-scroll,
.yb-news-detail__content > table,
.yb-news-detail__content > .column2-float-01,
.yb-news-detail__content > .column2-flex-02,
.yb-news-detail__content > .column3-grid-01,
.yb-news-detail__content > .box-01,
.yb-news-detail__content > .inquiry-01,
.yb-news-detail__content > .wrap > figure,
.yb-news-detail__content > .wrap > .wp-block-image,
.yb-news-detail__content > .wrap > .wp-block-gallery,
.yb-news-detail__content > .wrap > .gallery,
.yb-news-detail__content > .wrap > .wp-block-table,
.yb-news-detail__content > .wrap > .table-scroll,
.yb-news-detail__content > .wrap > table,
.yb-news-detail__content > .wrap > .column2-float-01,
.yb-news-detail__content > .wrap > .column2-flex-02,
.yb-news-detail__content > .wrap > .column3-grid-01,
.yb-news-detail__content > .wrap > .box-01,
.yb-news-detail__content > .wrap > .inquiry-01 {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}

.yb-news-detail__content h2,
.yb-news-detail__content .heading-02 h2 {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--yb-black);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.25;
}

.yb-news-detail__content h2::before,
.yb-news-detail__content .heading-02 h2::before {
  content: "";
  width: 4px;
  height: 1.1em;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-news-detail__content h3,
.yb-news-detail__content .heading-03 h3 {
  color: #222222;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.35;
}

.yb-news-detail__content h4,
.yb-news-detail__content h5,
.yb-news-detail__content h6 {
  color: #222222;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.45;
}

.yb-news-detail__content p {
  margin: 0;
}

.yb-news-detail__content .heading-02,
.yb-news-detail__content .heading-03,
.yb-news-detail__content .heading-04 {
  margin: 0;
}

.yb-news-detail__content ul,
.yb-news-detail__content ol {
  display: grid;
  gap: 8px;
  padding-left: 0;
  list-style: none;
}

.yb-news-detail__content li {
  position: relative;
  padding-left: 20px;
}

.yb-news-detail__content ul > li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.72em;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #33b3ed;
  transform: translateY(-50%);
}

.yb-news-detail__content ol {
  counter-reset: news-detail-list;
}

.yb-news-detail__content .dl-01 {
  display: grid;
  gap: 12px;
}

.yb-news-detail__content .dl-01 dt {
  color: var(--yb-black);
  font-weight: 500;
}

.yb-news-detail__content .dl-01 dd {
  margin: 0;
}

.yb-news-detail__content ol > li {
  counter-increment: news-detail-list;
}

.yb-news-detail__content ol > li::before {
  content: counter(news-detail-list) ".";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-weight: 500;
}

.yb-news-detail__content a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #2f3336;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.yb-news-detail__content a:hover {
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 8%;
}

.yb-news-detail__content a[target=_blank]::after,
.yb-news-detail__content a[href$=".pdf" i]::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-news-detail__content a[target=_blank]::after {
  mask-image: url("../img/common/icon-blank.svg");
}

.yb-news-detail__content a[href$=".pdf" i]::after {
  min-width: fit-content;
  width: 20px;
  height: 20px;
  mask-image: url("../img/common/icon-pdf_01.svg");
}

.yb-news-detail__content img {
  display: block;
  max-width: 100%;
  height: auto;
}

.yb-news-detail__content figure {
  display: grid;
  gap: 10px;
  margin: 0;
}

.yb-news-detail__content .wp-block-gallery,
.yb-news-detail__content .gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.yb-news-detail__content .column2-float-01,
.yb-news-detail__content .column2-flex-02 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.yb-news-detail__content .column2-float-01:has(> :only-child),
.yb-news-detail__content .column2-flex-02:has(> :only-child) {
  grid-template-columns: 1fr;
}

.yb-news-detail__content .column3-grid-01 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.yb-news-detail__content table,
.yb-news-detail__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.yb-news-detail__content th,
.yb-news-detail__content td,
.yb-news-detail__table th,
.yb-news-detail__table td {
  padding: 10px;
  border: 1px solid #231815;
  color: #231815;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
  vertical-align: middle;
}

.yb-news-detail__content th,
.yb-news-detail__table th {
  background: #33b3ed;
  color: var(--yb-white);
  text-align: center;
}

.yb-news-detail__table th {
  width: 180px;
}

.yb-news-detail__content .box-01,
.yb-news-detail__content .inquiry-01 {
  display: grid;
  gap: 16px;
  padding: 24px;
  border: 1px solid #bfe7f9;
  background: #f4fbfe;
}

.yb-news-detail__content .btn-02 a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 24px;
  border: 1px solid var(--yb-blue);
  color: var(--yb-blue);
  font-weight: 500;
  text-decoration: none;
}

.yb-news-detail__content .link-square-01 a {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 16px 172px 16px 56px;
  border: 1px solid #bfe7f9;
  color: var(--yb-black);
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.yb-news-detail__content .link-square-01 a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 24px;
  width: 18px;
  height: 18px;
  background-color: var(--yb-blue);
  mask-image: url("../img/common/icon-document.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transform: translateY(-50%);
}

.yb-news-detail__content .link-square-01 a::after {
  content: "Webで見る";
  position: absolute;
  top: 50%;
  right: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 5px 24px;
  border: 1px solid var(--yb-blue);
  border-radius: 24px;
  background-color: transparent;
  color: var(--yb-blue);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  mask-image: none;
  text-decoration: none;
  white-space: nowrap;
  transform: translateY(-50%);
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-news-detail__content .link-square-01 a:hover,
.yb-news-detail__content .link-square-01 a:focus-visible {
  border-color: var(--yb-blue);
  background-color: var(--yb-blue-10);
  color: var(--yb-black);
  text-decoration: none;
}

.yb-news-detail__content .link-square-01 a:hover::after,
.yb-news-detail__content .link-square-01 a:focus-visible::after {
  border-color: var(--yb-blue);
  background-color: var(--yb-blue);
  color: var(--yb-white);
}

.yb-news-detail__content .link-square-01.link-pdf-01 a::after {
  content: "ダウンロード";
  padding-right: 42px;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 11L4 7L5.0625 5.9375L7.25 8.125V1H8.75V8.125L10.9375 5.9375L12 7L8 11ZM3.49417 14C3.08139 14 2.72917 13.8531 2.4375 13.5594C2.14583 13.2656 2 12.9125 2 12.5V11H3.5V12.5H12.5V11H14V12.5C14 12.9125 13.8531 13.2656 13.5592 13.5594C13.2653 13.8531 12.9119 14 12.4992 14H3.49417Z' fill='%2300A0E9'/%3E%3C/svg%3E");
  background-position: right 20px center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
  mask-image: none;
}

.yb-news-detail__content .link-square-01.link-pdf-01 a:hover::after,
.yb-news-detail__content .link-square-01.link-pdf-01 a:focus-visible::after {
  border-color: var(--yb-blue);
  background-color: var(--yb-blue);
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 11L4 7L5.0625 5.9375L7.25 8.125V1H8.75V8.125L10.9375 5.9375L12 7L8 11ZM3.49417 14C3.08139 14 2.72917 13.8531 2.4375 13.5594C2.14583 13.2656 2 12.9125 2 12.5V11H3.5V12.5H12.5V11H14V12.5C14 12.9125 13.8531 13.2656 13.5592 13.5594C13.2653 13.8531 12.9119 14 12.4992 14H3.49417Z' fill='%23ffffff'/%3E%3C/svg%3E");
  color: var(--yb-white);
}

.yb-news-detail__content .link-circle-01 {
  display: flex;
  justify-content: center;
}

.yb-news-detail__content .link-circle-01 a {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 32px;
  padding: 8px 24px;
  border: 1px solid #231815;
  border-radius: 110px;
  background-color: var(--yb-white);
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.yb-news-detail__content .link-circle-01 a::before {
  display: none;
}

.yb-news-detail__content .link-circle-01 a > span {
  margin-left: 4px;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  white-space: normal;
}

.yb-news-detail__content .link-circle-01 a::after {
  content: "";
  position: static;
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transform: none;
  transition: background-color 0.2s ease, background-image 0.2s ease;
}

.yb-news-detail__content .link-circle-01 a:hover,
.yb-news-detail__content .link-circle-01 a:focus-visible {
  border-color: var(--yb-blue);
  background-color: var(--yb-blue);
  color: var(--yb-white);
}

.yb-news-detail__content .link-circle-01.link-external-01:not(.link-pdf-01) a::after,
.yb-news-detail__content .link-circle-01:not(.link-pdf-01) a[target=_blank]:not([href$=".pdf"]):not([href$=".PDF"]):not([href*=".pdf"]):not([href*=".PDF"])::after {
  background-color: transparent;
  background-image: url("../img/common/icon-external-link_02.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  mask-image: none;
}

.yb-news-detail__content .link-circle-01.link-external-01:not(.link-pdf-01) a:hover::after,
.yb-news-detail__content .link-circle-01.link-external-01:not(.link-pdf-01) a:focus-visible::after,
.yb-news-detail__content .link-circle-01:not(.link-pdf-01) a[target=_blank]:not([href$=".pdf"]):not([href$=".PDF"]):not([href*=".pdf"]):not([href*=".PDF"]):hover::after,
.yb-news-detail__content .link-circle-01:not(.link-pdf-01) a[target=_blank]:not([href$=".pdf"]):not([href$=".PDF"]):not([href*=".pdf"]):not([href*=".PDF"]):focus-visible::after {
  background-image: url("../img/common/icon-external-link_03.svg");
}

.yb-news-detail__content .link-circle-01.link-pdf-01 a::after,
.yb-news-detail__content .link-circle-01 a[href$=".pdf"]::after,
.yb-news-detail__content .link-circle-01 a[href$=".PDF"]::after,
.yb-news-detail__content .link-circle-01 a[href*=".pdf"]::after,
.yb-news-detail__content .link-circle-01 a[href*=".PDF"]::after {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
  background-color: transparent;
  background-image: url("../img/common/icon-pdf_01.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  mask-image: none;
}

.yb-news-detail__footer {
  width: 624px;
  max-width: calc(100% - 96px);
  margin: 0 auto;
}

.yb-news-detail__pager {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
}

.yb-news-detail__pager > div:last-child {
  justify-self: end;
}

.yb-news-detail__pager-link--prev::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transform: rotate(180deg);
}

.yb-news-detail__pager-link--prev::after {
  display: none;
}

.yb-news-detail__pager .yb-news-detail__pager-link--prev::after {
  content: none;
  display: none;
}

.yb-news-detail__pager .yb-page-more-button {
  color: var(--yb-blue);
  white-space: nowrap;
}

.yb-news-detail__pager .yb-news-detail__pager-link--return::after {
  content: none;
  display: none;
}

.yb-feature-callout {
  width: 100%;
  padding: 12px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 12px/1px calc(100% - 24px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 12px/1px calc(100% - 24px) no-repeat;
}

.yb-feature-callout__body {
  display: grid;
  gap: 16px;
  padding: 32px;
  border-radius: 8px;
  background: #e6f6fd;
}

.yb-feature-callout__text {
  display: grid;
  gap: 8px;
}

.yb-feature-callout__text h2,
.yb-feature-callout__text p {
  margin: 0;
}

.yb-feature-callout__text h2 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-feature-callout__text p {
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-page-more-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 32px;
  padding: 7px 24px;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1.25;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-page-more-button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

a.yb-page-more-button:hover,
a.yb-page-more-button:focus-visible,
a:hover .yb-value-more-button,
a:focus-visible .yb-value-more-button {
  border-color: var(--yb-blue);
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-news-detail__pager a.yb-page-more-button:hover,
.yb-news-detail__pager a.yb-page-more-button:focus-visible {
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
  color: var(--yb-blue);
}

.yb-page-more-button--blue {
  color: var(--yb-blue);
}

a.yb-page-more-button--blue:hover,
a.yb-page-more-button--blue:focus-visible,
a:hover .yb-page-more-button--blue,
a:focus-visible .yb-page-more-button--blue {
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
  color: var(--yb-blue);
}

.yb-page-more-button--external::after {
  background-image: none;
  background-color: currentColor;
  mask-image: url("../img/common/icon-blank.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-page-more-button--disabled {
  color: var(--yb-gray);
  cursor: default;
  pointer-events: none;
}

.yb-outline-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 32px;
  padding: 8px 24px;
  border: 1px solid var(--yb-blue);
  border-radius: 24px;
  background: var(--yb-white);
  color: var(--yb-blue);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-outline-button span {
  min-width: 0;
}

.yb-outline-button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: var(--yb-outline-icon, url("../img/common/arrow-black.svg"));
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-outline-button--external {
  --yb-outline-icon: url("../img/common/icon-blank.svg");
}

.yb-outline-button--download {
  --yb-outline-icon: url("../img/common/icon-download.svg");
}

.yb-primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 60px;
  padding: 10px 32px;
  border: 1px solid transparent;
  border-radius: 30px;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 20px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

a.yb-primary-button:hover,
a.yb-primary-button:focus-visible,
button.yb-primary-button:hover,
button.yb-primary-button:focus-visible {
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
  color: var(--yb-blue);
  cursor: pointer;
}

.yb-primary-button span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 0;
}

.yb-primary-button small {
  font: inherit;
  font-size: 14px;
}

.yb-primary-button::before,
.yb-primary-button::after {
  content: "";
  display: none;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-primary-button--external::after {
  display: inline-block;
  mask-image: url("../img/common/icon-blank.svg");
  width: 16px;
  height: 16px;
}

.yb-primary-button--arrow::after {
  display: inline-block;
  width: 16px;
  height: 16px;
  mask-image: url("../img/common/arrow-white.svg");
}

.yb-course-intro__body .yb-primary-button,
.yb-department-index__button {
  justify-self: start;
  gap: 8px;
  width: fit-content;
  min-width: 299px;
  min-height: 48px;
  padding: 8px 24px;
  border-radius: 24px;
  font-size: 16px;
  white-space: nowrap;
}

.yb-primary-button--pamphlet::before {
  display: inline-block;
  width: 26px;
  height: 26px;
  mask-image: url("../img/common/icon-pamphlet.svg");
}

.yb-primary-button--mail::before {
  display: inline-block;
  mask-image: url("../img/common/icon-mail.svg");
}

.yb-primary-button--mail span {
  margin-right: auto;
}

.yb-primary-button--mail::after {
  display: inline-block;
  width: 16px;
  height: 16px;
  mask-image: url("../img/common/arrow-black.svg");
  transform: rotate(0deg);
}

.yb-file-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 390px;
  min-height: 32px;
  padding: 7px 24px;
  border: 1px solid var(--yb-blue);
  border-radius: 999px;
  background: var(--yb-white);
  color: var(--yb-blue);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1.3;
}

.yb-file-button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/icon-download.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-download-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
}

.yb-download-card {
  padding: 8px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 8px/calc(100% - 16px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 8px/calc(100% - 16px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 8px/1px calc(100% - 16px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 8px/1px calc(100% - 16px) no-repeat;
}

.yb-download-card__body {
  display: grid;
  gap: 24px;
  padding: 32px 18px;
}

.yb-download-card__body h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-download-card__body h3::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background-color: var(--yb-blue);
  mask-image: url("../img/common/icon-document.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-download-card__body p {
  margin: -12px 0 0;
  padding-left: 30px;
  color: #474b4e;
  font-size: 12px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-download-card__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 32px;
  padding: 8px 24px;
  border: 1px solid var(--yb-black);
  border-radius: 24px;
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-download-card__button::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/icon-download.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-document-card-list {
  display: grid;
  gap: 64px;
}

.yb-document-card {
  overflow: hidden;
  border: 1px solid #bfe7f9;
  background: var(--yb-white);
  clip-path: polygon(48px 0, 100% 0, 100% calc(100% - 48px), calc(100% - 48px) 100%, 0 100%, 0 48px);
  scroll-margin-top: calc(var(--yb-header) + 16px);
}

#admission-pamphlet {
  scroll-margin-top: calc(var(--yb-header) + 16px);
}

.yb-document-card__media {
  display: grid;
  place-items: center;
  width: 100%;
  height: 350px;
  margin: 0;
  background: #f0f2f4;
}

.yb-document-card__cover {
  display: block;
  width: auto;
  height: 280px;
  max-width: 220px;
  object-fit: contain;
}

.yb-document-card__body {
  display: grid;
  gap: 16px;
  padding: 32px;
}

.yb-document-card__text {
  display: grid;
  gap: 8px;
}

.yb-document-card__text h3,
.yb-document-card__text p {
  margin: 0;
}

.yb-document-card__text h3 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-document-card__text p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-document-card__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.yb-document-card__actions.is-single {
  grid-template-columns: minmax(0, 272px);
}

.yb-icon-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 64px 32px;
  padding-top: 16px;
}

.yb-icon-link-card {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 0 2px;
  color: var(--yb-black);
}

.yb-icon-link-card__head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--yb-line);
}

.yb-icon-link-card__head img {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
}

.yb-icon-link-card__head strong {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex: 1 1 auto;
  min-width: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-icon-link-card__head strong::after {
  content: "";
  display: inline-block;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  background-image: url("../img/common/arrow-black.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.yb-icon-link-card__description {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-campuslife-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-admission-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-admission-index__section--entry {
  padding-bottom: 16px;
}

.yb-admission-index__more {
  display: flex;
  justify-content: flex-end;
}

.yb-admission-index .yb-section-lead {
  margin-top: -8px;
}

.yb-admission-index .yb-primary-button--pamphlet {
  margin-top: 0px;
}

.yb-admission-detail__section--intro {
  margin-top: -48px;
}

.yb-admission-detail__hero-image {
  width: 100%;
  margin: 0 0 32px;
}

.yb-admission-detail__hero-image img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-admission-detail-content {
  display: grid;
  gap: 32px;
  padding-top: 16px;
}

.yb-admission-detail-block {
  display: grid;
  gap: 16px;
}

.yb-admission-detail-block h3,
.yb-admission-detail-block h4,
.yb-admission-detail-block h5,
.yb-admission-detail-block p {
  margin: 0;
}

.yb-admission-detail-block h3 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-admission-detail-block h4 {
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-admission-detail-block h5 {
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-top: 12px;
}

.yb-admission-detail-block h5.yb-outline-panel__head::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #33b3ed;
}
.yb-admission-detail-block h5.yb-outline-panel__head {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.5;
  position: relative;
  padding-left: 20px;
}

.yb-admission-detail-block p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.025em;
  line-height: 1.7;
}

.yb-dot-list,
.yb-note-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
  list-style: none;
}

.yb-dot-list li {
  position: relative;
  padding-left: 20px;
}

.yb-dot-list li::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #33b3ed;
}

.yb-note-list {
  gap: 4px;
}
.yb-note-list li {
  font-feature-settings: normal;
  font-size: 13px;
  letter-spacing: 0;
  padding-left: 1.25em;
  text-indent: -1.25em;
}

.yb-note-list li::before {
  content: "※ ";
}

.yb-outline-panel {
  padding: 16px 20px;
  border: 1px solid var(--yb-blue);
}
h5 + .yb-outline-panel {
  margin-top: -8px;
}

.yb-resource-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  padding: 12px 24px;
  border: 1px solid #bfe7f9;
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
  transition: border-color 0.18s ease, background-color 0.18s ease;
}

.yb-resource-link span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.yb-resource-link span::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  background-color: var(--yb-blue);
  mask-image: url("../img/common/icon-document.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-resource-link em {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 24px;
  padding: 5px 24px;
  border: 1px solid var(--yb-blue);
  border-radius: 24px;
  color: var(--yb-blue);
  font-style: normal;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  white-space: nowrap;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

a.yb-resource-link:hover,
a.yb-resource-link:focus-visible {
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
}

a.yb-resource-link:hover em,
a.yb-resource-link:focus-visible em {
  border-color: var(--yb-blue);
  background: var(--yb-blue);
  color: var(--yb-white);
}

.yb-resource-link--external em::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/icon-blank.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-table-scroll {
  width: 100%;
  overflow-x: auto;
}

.yb-blue-table {
  width: 100%;
  border-collapse: collapse;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.025em;
  line-height: 1.6;
}

.yb-blue-table th,
.yb-blue-table td {
  padding: 16px 8px;
  border: 1px solid #33b3ed;
  text-align: left;
  vertical-align: middle;
}

.yb-blue-table th {
  width: 160px;
  border-color: #fff;
  border-top-color: #33b3ed;
  background: #33b3ed;
  color: var(--yb-white);
  font-weight: 500;
}
.yb-blue-table th:first-child {
  border-left-color: #33b3ed;
}

.yb-blue-table thead th:not(:first-child) {
  border-bottom-color: #33b3ed;
}
.yb-blue-table thead th:not(:first-child):last-child {
  border-right-color: #33b3ed;
}

.yb-blue-table tbody tr:last-child th {
  border-bottom-color: #33b3ed;
}

.yb-blue-table--row-header-separated tbody:not(:last-child) tr:last-child th {
  border-bottom-color: var(--yb-white);
}

.yb-blue-table td {
  background: var(--yb-white);
}

.yb-table-link--external {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.yb-table-link--external::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/icon-blank.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-blue-table--common-test th,
.yb-blue-table--common-test td {
  padding: 16px;
  width: auto;
}

.yb-blue-table--common-test thead th:first-child {
  width: 180px;
  border-bottom-color: #33b3ed;
}

.yb-blue-table--common-test tbody th {
  width: 180px;
  border-color: #33b3ed;
  background: #bfe7f9;
  color: #474b4e;
}

.yb-blue-table--schedule {
  min-width: 624px;
  font-size: 13px;
}

.yb-blue-table--schedule thead th {
  width: auto;
}

.yb-blue-table--schedule tbody th {
  min-width: 56px;
  max-width: 104px;
  text-align: center;
}

.yb-admission-event__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-admission-event__heading {
  padding-bottom: 0;
}

.yb-admission-event__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0;
  line-height: 1.7;
}

.yb-admission-event__cards {
  display: grid;
  gap: 64px;
  padding: 0 var(--yb-pad);
}

.yb-admission-event-card {
  display: grid;
  width: 100%;
}

.yb-admission-event-card__image {
  position: relative;
  width: 100%;
  height: 260px;
  margin: 0;
  overflow: hidden;
  background: #f0f2f4;
  clip-path: polygon(48px 0, 100% 0, 100% 100%, 0 100%, 0 48px);
}

.yb-admission-event-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-admission-event-card__body {
  min-height: 241px;
  border-right: 1px solid #bfe7f9;
  border-left: 1px solid #bfe7f9;
  background: linear-gradient(135deg, transparent 0 34px, #bfe7f9 34px 35px, transparent 35px) right bottom/48px 48px no-repeat, linear-gradient(#bfe7f9, #bfe7f9) left bottom/calc(100% - 48px) 1px no-repeat, #e5f5fd;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 48px), calc(100% - 48px) 100%, 0 100%);
}

.yb-admission-event-card__content {
  display: grid;
  gap: 16px;
  align-content: start;
  padding: 32px;
}

.yb-admission-event-card__text {
  display: grid;
  gap: 8px;
}

.yb-admission-event-card h2,
.yb-admission-event-card p {
  margin: 0;
}

.yb-admission-event-card h2 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-admission-event-card p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-admission-event-card__button {
  justify-self: start;
}

.yb-admission-event__section--contact {
  padding-top: 0;
}

.yb-admission-event-contact__body {
  gap: 32px;
}

.yb-admission-event-contact h2,
.yb-admission-event-contact p {
  margin: 0;
}

.yb-admission-event-contact h2 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1.25;
}

.yb-admission-event-contact__info {
  display: grid;
  gap: 8px;
  justify-items: start;
}

.yb-admission-event-contact__info > p {
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-admission-event-contact__numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 32px;
}

.yb-admission-event-contact__number {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 20px;
}

.yb-admission-event-contact__number span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 53px;
  height: 18px;
  padding: 3px 4px;
  border: 1px solid var(--yb-black);
  border-radius: 4px;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  line-height: 1;
}

.yb-admission-event-contact__number a,
.yb-admission-event-contact__number p {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-admission-event-contact__number small {
  font-family: var(--yb-font-jp);
  font-size: 14px;
  letter-spacing: 0.025em;
}

.yb-society-pas-flow__contact {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.yb-society-pas-flow__contact span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 18px;
  padding: 3px 4px;
  border: 1px solid var(--yb-black);
  border-radius: 4px;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  line-height: 1;
}

.yb-society-pas-flow__contact strong {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-admission-event-contact__buttons {
  display: grid;
  gap: 16px;
  justify-items: start;
}

.yb-admission-event-contact__mail {
  width: fit-content;
  min-height: 48px;
  padding: 8px 24px;
  justify-content: space-between;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.yb-admission-event-contact__mail span {
  padding-right: 48px;
}

.yb-admission-event-contact__access {
  min-height: 32px;
}

.yb-inline-tel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.yb-inline-tel__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 31px;
  height: 18px;
  padding: 3px 4px;
  border: 1px solid var(--yb-black);
  border-radius: 4px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-inline-tel__value {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-pamphlet__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-pamphlet__inner .yb-page-section {
  padding-top: 0;
}

.yb-pamphlet__heading {
  padding-bottom: 0;
}

.yb-pamphlet__heading .yb-page-heading__description {
  width: 626px;
  color: #2f3336;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

.yb-pamphlet__heading > p {
  color: var(--yb-blue);
}

.yb-pamphlet__section--documents {
  gap: 24px;
}

.yb-pamphlet__request-text {
  padding: 0 24px 0 2px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-pamphlet__request-text p {
  margin: 0;
}

.yb-pamphlet__request-image {
  width: 100%;
  margin: 0;
}

.yb-pamphlet__request-image img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-pamphlet__request-button {
  margin-top: 8px;
}

.yb-pamphlet-contact__body {
  display: grid;
  gap: 24px;
  align-content: start;
  padding: 32px;
}

.yb-pamphlet-contact__body h2,
.yb-pamphlet-contact__body p {
  margin: 0;
}

.yb-pamphlet-contact__body h2 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-pamphlet-contact__info {
  display: grid;
  gap: 8px;
}

.yb-pamphlet-contact__info > p {
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-pamphlet-contact__button {
  width: 277px;
  min-height: 48px;
  padding: 8px 24px;
  justify-content: space-between;
  font-size: 16px;
  letter-spacing: 0.1em;
}

.yb-pamphlet-contact__button span {
  justify-content: flex-start;
}

.yb-contribute__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-contribute__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0;
  line-height: 1.7;
}

.yb-contribute__more {
  display: flex;
  justify-content: flex-end;
  margin-top: 32px;
}

.yb-contribute-card-grid .yb-post-card:nth-child(odd)::after {
  bottom: 0;
}

.yb-contribute__section--volunteer .yb-section-lead {
  margin-top: -8px;
}

.yb-contribute__section--volunteer .yb-section-lead p {
  padding-right: 0;
}

.yb-contribute__section--contact {
  padding-top: 0;
}

.yb-contribute-contact__body {
  gap: 32px;
}

.yb-contribute-contact__head {
  display: grid;
  gap: 32px;
}

.yb-contribute-contact h2,
.yb-contribute-contact p {
  margin: 0;
}

.yb-contribute-contact h2 {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contribute-contact__info {
  display: grid;
  gap: 16px;
  justify-items: start;
}

.yb-contribute-contact__info > p {
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contribute-contact__tel {
  display: flex;
  align-items: center;
  gap: 8px;
}

.yb-contribute-contact__tel span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 31px;
  height: 24px;
  padding: 4px;
  border: 1px solid var(--yb-blue);
  border-radius: 4px;
  background: var(--yb-white);
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contribute-contact__tel a {
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 32px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-contribute-contact__mail {
  width: 390px;
  min-height: 48px;
  padding: 8px 24px;
  justify-content: space-between;
  font-size: 16px;
  letter-spacing: 0.1em;
}

.yb-contribute-contact__text {
  display: grid;
  gap: 0;
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-contribute-contact__text p + p {
  margin-top: 24px;
}

.yb-contribute-contact__downloads {
  display: grid;
  gap: 16px;
  justify-items: start;
}

.yb-career-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center top;
}

.yb-career-index-card h3 small {
  font-size: 15px;
  letter-spacing: 0;
}

.yb-graduate-index__fixed-bg .yb-fixed-bg__layer,
.yb-general-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-graduate-index__inner,
.yb-general-index__inner {
  padding: 40px 0 96px;
}

.yb-graduate-index__heading,
.yb-general-index__heading {
  padding-bottom: 0;
}

.yb-graduate-index__lead,
.yb-general-index__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

.yb-graduate-index__section--news,
.yb-general-index__section--news {
  gap: 12px;
}

.yb-graduate-index__news-list,
.yb-general-index__news-list {
  padding-top: 0;
}

.yb-graduate-index__news-list .yb-news-item:last-child,
.yb-general-index__news-list .yb-news-item:last-child {
  border-bottom: 1px solid var(--yb-line);
}

.yb-graduate-index__news-list .yb-news-item a,
.yb-general-index__news-list .yb-news-item a {
  gap: 12px;
  padding: 24px 4px;
}

.yb-graduate-index__news-list .yb-news-item__meta,
.yb-general-index__news-list .yb-news-item__meta {
  gap: 24px;
}

.yb-graduate-index__news-list .yb-tag,
.yb-general-index__news-list .yb-tag {
  min-height: 24px;
  padding: 6px 12px;
  border-color: #a6a6a7;
  border-radius: 4px;
  color: #6b7175;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-graduate-index__news-more,
.yb-general-index__news-more {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.yb-graduate-index__service-grid,
.yb-general-index__service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px 32px;
  padding-top: 24px;
}

.yb-action-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px 32px;
  padding-top: 24px;
}

.yb-action-card {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
}

.yb-action-card h3,
.yb-action-card p {
  margin: 0;
}

.yb-action-card h3 {
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-action-card p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-action-card__button {
  margin-top: 8px;
}

.yb-notice-panel {
  width: 100%;
  padding: 12px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 12px/1px calc(100% - 24px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 12px/1px calc(100% - 24px) no-repeat;
}

.yb-notice-panel__body {
  display: grid;
  gap: 8px;
  padding: 32px;
  border-radius: 8px;
  background: #e6f6fd;
}

.yb-notice-panel__body h2,
.yb-notice-panel__body p {
  margin: 0;
}

.yb-notice-panel__body h2 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-notice-panel__body p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-notice-panel__body .yb-page-more-button {
  margin-top: 8px;
}

.yb-system-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

.yb-system-card {
  display: grid;
  gap: 24px;
  align-content: start;
  min-width: 0;
  min-height: 172px;
  padding: 40px 24px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 8px/calc(100% - 16px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 8px/calc(100% - 16px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 8px/1px calc(100% - 16px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 8px/1px calc(100% - 16px) no-repeat;
}

.yb-system-card h3 {
  padding: 0 2px;
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-system-card__button {
  justify-content: space-between;
  width: 100%;
  max-width: 134.67px;
  min-height: 32px;
}

.yb-graduate-service-card {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
}

.yb-graduate-service-card h3,
.yb-graduate-service-card p {
  margin: 0;
}

.yb-graduate-service-card h3 {
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-graduate-service-card p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-graduate-service-card__button {
  margin-top: 8px;
}

.yb-graduate-index .yb-value-section--interview {
  width: 672px;
  margin-right: auto;
  margin-left: auto;
}

.yb-examinee-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-examinee-index__inner {
  padding: 40px 0 96px;
}

.yb-examinee-index__heading {
  padding-bottom: 0;
}

.yb-examinee-index__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

.yb-examinee-index__section--pickup {
  gap: 24px;
}

.yb-examinee-index__pickup-grid {
  gap: 32px;
}

.yb-examinee-index__section--event {
  gap: 24px;
}

.yb-examinee-event-cards {
  display: grid;
  gap: 32px;
}

.yb-examinee-event-card h3 {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-examinee-pickup-card__body {
  gap: 20px;
}

.yb-examinee-pickup-card__text {
  gap: 16px;
}

.yb-examinee-pickup-card__description {
  letter-spacing: 0.05em;
}

.yb-examinee-index__section--news,
.yb-admission-index__section--news {
  gap: 12px;
}

.yb-examinee-index__news-list,
.yb-admission-index__news-list {
  padding-top: 0;
}

.yb-examinee-index__news-list .yb-news-item:last-child,
.yb-admission-index__news-list .yb-news-item:last-child {
  border-bottom: 1px solid var(--yb-line);
}

.yb-examinee-index__news-list .yb-news-item a,
.yb-admission-index__news-list .yb-news-item a {
  gap: 12px;
  padding: 24px 4px;
}

.yb-examinee-index__news-list .yb-news-item__meta,
.yb-admission-index__news-list .yb-news-item__meta {
  gap: 24px;
}

.yb-examinee-index__news-list .yb-tag,
.yb-admission-index__news-list .yb-tag {
  min-height: 24px;
  padding: 6px 12px;
  border-color: #a6a6a7;
  border-radius: 4px;
  color: #6b7175;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-examinee-index__news-more,
.yb-admission-index__more {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.yb-examinee-index__support-grid {
  gap: 48px 32px;
}

.yb-examinee-index__documents-note {
  margin-top: -8px;
}

.yb-examinee-index .yb-primary-button--pamphlet {
  margin-top: 0;
}

.yb-examinee-index .yb-value-section--interview {
  width: 672px;
  margin-right: auto;
  margin-left: auto;
}

.yb-student-index__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-student-index__inner {
  padding: 40px 0 96px;
}

.yb-student-index__heading {
  padding-bottom: 0;
}

.yb-student-index__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

.yb-student-index__section--suspension {
  padding-bottom: 0;
}

.yb-student-index__section--news {
  gap: 12px;
}

.yb-student-index__news-list {
  padding-top: 0;
}

.yb-student-index__news-list .yb-news-item:last-child {
  border-bottom: 1px solid var(--yb-line);
}

.yb-student-index__news-list .yb-news-item a {
  gap: 12px;
  padding: 24px 4px;
}

.yb-student-index__news-list .yb-news-item__meta {
  gap: 24px;
}

.yb-student-index__news-list .yb-tag {
  min-height: 24px;
  padding: 6px 12px;
  border-color: #a6a6a7;
  border-radius: 4px;
  color: #6b7175;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-learning-common__fixed-bg .yb-fixed-bg__layer,
.yb-learning-context__fixed-bg .yb-fixed-bg__layer,
.yb-learning-curator__fixed-bg .yb-fixed-bg__layer,
.yb-learning-web__fixed-bg .yb-fixed-bg__layer,
.yb-learning-teacher__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-learning-common__content,
.yb-learning-context__content,
.yb-learning-curator__content,
.yb-learning-web__content,
.yb-learning-teacher__content {
  display: grid;
  gap: 64px;
  padding: 0;
}

.yb-learning-common__heading,
.yb-learning-context__heading,
.yb-learning-curator__heading,
.yb-learning-web__heading,
.yb-learning-teacher__heading {
  padding-bottom: 0;
}

.yb-learning-common__lead,
.yb-learning-context__lead,
.yb-learning-curator__lead,
.yb-learning-web__lead,
.yb-learning-teacher__lead {
  width: 626px;
  color: #474b4e;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-learning-common__section,
.yb-learning-context__section,
.yb-learning-curator__section,
.yb-learning-web__section,
.yb-learning-teacher__section {
  margin-top: 0 !important;
}

.yb-learning-teacher__section--table {
  gap: 16px;
}

.yb-learning-common__section--table {
  gap: 16px;
}

.yb-learning-common__table-wrap {
  width: 624px;
}

.yb-learning-shared__pickup {
  display: grid;
  gap: 12px;
  padding: 24px var(--yb-pad);
}

.yb-learning-shared__pickup h2,
.yb-learning-shared__pickup > p {
  margin: 0;
}

.yb-learning-shared__pickup h2 {
  color: #131313;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-learning-shared__pickup > p {
  width: 622px;
  padding-left: 2px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}
.yb-learning-shared__pickup > p + .yb-learning-shared__pickup-grid {
  margin-top: 12px;
}

.yb-learning-shared__pickup-grid {
  gap: 48px 32px;
}

.yb-learning-shared__pickup-card--placeholder .yb-index-card__image {
  background: #858b8e;
}

.yb-learning-shared__pickup-card .yb-index-card__body {
  gap: 24px;
}

.yb-learning-shared__pickup-card .yb-index-card__description {
  letter-spacing: 0.05em;
}

.yb-learning-shared__section--related {
  padding-bottom: 0;
}

.yb-learning-shared__related-list {
  gap: 32px;
}

.yb-learning-shared__resource-list {
  display: grid;
  gap: 12px;
}

.yb-learning-shared__resource {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 64px;
  padding: 16px 32px;
  border: 1px solid #bfe7f9;
}

.yb-learning-shared__resource-title {
  position: relative;
  margin: 0;
  padding-left: 30px;
  color: #131313;
  font-size: 14px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-learning-shared__resource-title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 20px;
  height: 20px;
  background: var(--yb-blue);
  transform: translateY(-50%);
  mask-image: url("../img/common/icon-document.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-learning-shared__resource-note {
  margin: 12px 0 0;
  padding-left: 30px;
  color: #474b4e;
  font-size: 12px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-learning-shared__resource-buttons {
  display: grid;
  gap: 12px;
}

.yb-learning-shared__resource-button {
  min-width: 176px;
  border-radius: 25px;
  font-size: 13px;
  letter-spacing: 0.1em;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-learning-shared__resource-button:hover,
.yb-learning-shared__resource-button:focus-visible {
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
  color: var(--yb-blue);
}

.yb-learning-shared__resource-button span {
  white-space: nowrap;
}

.yb-learning-teacher__section--license {
  gap: 24px;
}

.yb-learning-web__section--requirements {
  gap: 24px;
}

.yb-learning-web__section-lead p {
  width: 624px;
}

.yb-learning-web__resource-groups {
  display: grid;
  gap: 32px;
}

.yb-learning-web__resource-group {
  display: grid;
  gap: 16px;
}

.yb-learning-web__resource-group h3 {
  margin: 0;
  color: #000;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-learning-web__resource-list,
.yb-learning-web__table-wrap {
  width: 624px;
}

.yb-learning-web__section-heading {
  margin: 0;
  color: #000;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-learning-web__table-note {
  margin: 12px 0 0;
  color: #474b4e;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
}

.yb-learning-curator__lead-note {
  margin-top: 24px !important;
  padding-right: 0 !important;
  color: #474b4e;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
}

.yb-learning-teacher__hero-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: #000;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.3333333333;
}

.yb-learning-teacher__hero-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 64px;
  flex: 0 0 auto;
  background: var(--yb-blue);
}

.yb-learning-teacher__license-lead {
  gap: 16px;
}

.yb-learning-teacher__license-lead p {
  width: 624px;
}

.yb-learning-teacher__note {
  margin: 0;
  padding: 0 2px;
  color: #474b4e;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
}

.yb-learning-teacher__resource-list {
  width: 624px;
}

.yb-learning-teacher__section-heading {
  margin: 0;
  color: #000;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-learning-teacher__table-wrap {
  width: 624px;
}

.yb-license-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.yb-license-table th,
.yb-license-table td {
  padding: 14px 16px;
  border: 1px solid #33b3ed;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-align: left;
  vertical-align: middle;
}

.yb-license-table thead th,
.yb-license-table tbody th {
  background: #33b3ed;
  color: #fff;
}

.yb-license-table thead th + th {
  border-left-color: #fff;
}

.yb-license-table thead th:not(:last-child) {
  border-right-color: #fff;
}

.yb-license-table thead th:first-child,
.yb-license-table tbody tr:first-child > th,
.yb-license-table tbody tr:not(:last-child) > th {
  border-bottom-color: #fff;
}

.yb-license-table thead th:first-child,
.yb-license-table tbody th {
  width: 189px;
}

.yb-license-table thead th:nth-child(2),
.yb-license-table thead th:nth-child(3),
.yb-license-table tbody td {
  width: 217px;
}

.yb-license-table--single thead th:nth-child(2),
.yb-license-table--single tbody td {
  width: calc(100% - 189px);
}

.yb-license-table--single tbody th {
  border-right-color: #fff;
}

.yb-license-table--single tbody td {
  border-color: #80d0f4;
  border-left-color: #fff;
}

.yb-license-table--single tbody tr:last-child td {
  border-bottom-color: #33b3ed;
}

.yb-learning-teacher__table-note {
  margin: 12px 0 0;
  color: #474b4e;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
}

.yb-learning-teacher__subsections {
  display: grid;
  gap: 32px;
}

.yb-learning-teacher__subsection {
  display: grid;
  gap: 16px;
}

.yb-learning-teacher__subsection h3 {
  margin: 0;
  color: #000;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-learning-context__section--subjects {
  gap: 16px;
}

.yb-learning-context__subjects-wrap {
  width: 624px;
}

.yb-learning-context__subjects-subtitle {
  margin: 0 0 12px;
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-subject-box-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 0;
  row-gap: 0;
}

.yb-subject-box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 62px;
  padding: 16px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1;
  text-align: center;
}
.yb-subject-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 8px;
  right: 8px;
  height: 1px;
  background: #33b3ed;
}

.yb-subject-box--left {
  background: linear-gradient(#33b3ed, #33b3ed) left top 8px/1px calc(100% - 16px) no-repeat, linear-gradient(#33b3ed, #33b3ed) right top 8px/1px calc(100% - 16px) no-repeat;
}

.yb-subject-box--right {
  background: linear-gradient(#33b3ed, #33b3ed) right top 8px/1px calc(100% - 16px) no-repeat;
}

.yb-subject-box:nth-last-child(-n+2)::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 8px;
  right: 8px;
  height: 1px;
  background: #33b3ed;
}

.yb-student-index__news-more {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.yb-student-index__system-lead {
  margin-top: -8px;
}

.yb-student-index__support-grid {
  gap: 48px 32px;
}

.yb-student-index__support-grid .yb-action-card:last-child {
  grid-column: 1/2;
}

.yb-student-index .yb-value-section--interview {
  width: 672px;
  margin-right: auto;
  margin-left: auto;
}

.yb-department-index__inner {
  gap: 32px;
  padding-bottom: 0;
}

.yb-department-index__lead {
  margin-top: 24px;
  padding-left: 2px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-department-index__lead p {
  margin: 0;
}

.yb-department-index__button {
  margin-top: 24px;
}

.yb-department-index__course-nav {
  padding: 24px var(--yb-pad) 16px;
}

.yb-department-index__course-nav-title {
  display: flex;
  align-items: center;
  gap: 24px;
  width: 100%;
  padding-bottom: 16px;
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.yb-department-index__course-nav-title span {
  display: inline-flex;
  flex: 0 0 auto;
  white-space: nowrap;
}

.yb-department-index__course-nav-title::after {
  content: "";
  display: block;
  height: 1px;
  flex: 1 1 auto;
  background: var(--yb-line);
}

.yb-department-index__course-nav ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 32px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-department-index__course-nav li {
  min-width: 0;
}

.yb-department-index__course-nav a {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  height: 100%;
  min-height: 46px;
  padding: 12px 4px 8px 2px;
  border-bottom: max(2px, min(0.2777777778vw, 2px)) solid var(--course-color);
  font-size: 16px;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-department-index__course-nav a::after {
  content: "";
  display: inline-flex;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  margin-top: 6px;
  background: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transform: rotate(90deg);
}

.yb-department-index__details {
  padding: 48px var(--yb-pad) 96px;
  border-top: 1px solid #e6f6fd;
  background: rgba(229, 245, 253, 0.5);
}

.yb-department-index__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 304px));
  gap: 24px 16px;
}

.yb-department-card {
  position: relative;
  width: 304px;
  height: 470px;
  scroll-margin-top: calc(var(--yb-header) + 16px);
}

.yb-department-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--department-card-bg) center/cover no-repeat;
}

.yb-department-card a {
  position: absolute;
  left: 8px;
  top: 8px;
  display: flex;
  width: 288px;
  height: 454px;
  flex-direction: column;
  overflow: hidden;
  background: transparent;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%);
}

.yb-department-card__image {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 160px;
  margin: 0;
  overflow: hidden;
  flex: 0 0 160px;
}

.yb-department-card__image::before {
  display: none;
}

.yb-department-card__image img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: var(--card-image-width, 100%);
  height: var(--card-image-height, 100%);
  max-width: none;
  object-fit: cover;
  transform: translate(var(--card-image-x, 0), var(--card-image-y, 0));
}

.yb-department-card__body {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  padding: 24px 18px 18px;
  background: transparent;
}

.yb-department-card__text {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 4px;
}

.yb-department-card__course,
.yb-department-card h2,
.yb-department-card__description {
  margin: 0;
}

.yb-department-card__course {
  color: var(--course-color);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1.5;
}

.yb-department-card h2 {
  display: grid;
  gap: 4px;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1.45;
}

.yb-department-card h2 span {
  display: block;
}

.yb-department-card__description {
  margin-top: 12px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.5;
}

.yb-department-card__more {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: fit-content;
  min-width: 118px;
  min-height: 32px;
  margin-left: auto;
  padding: 7px 22px;
  border: 1px solid var(--yb-black);
  border-radius: 25px;
  background: var(--course-tint);
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.yb-department-card__more::after {
  content: "";
  display: inline-flex;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  background: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-department-card:hover .yb-department-card__more,
.yb-department-card:focus-within .yb-department-card__more,
.yb-department-card a:hover .yb-department-card__more,
.yb-department-card a:focus-visible .yb-department-card__more {
  border-color: var(--course-color);
  background: var(--course-tag-bg);
  color: var(--course-color);
}

.yb-department-card--paint {
  --card-image-width: 404.692px;
  --card-image-height: 269.701px;
  --card-image-x: -34.414px;
  --card-image-y: -77.65px;
}

.yb-department-card--sculpture {
  --card-image-width: 296.937px;
  --card-image-height: 197.888px;
  --card-image-x: -3.988px;
  --card-image-y: -14.252px;
}

.yb-department-card--craft {
  --card-image-width: 391.609px;
  --card-image-height: 260.98px;
  --card-image-x: -41.17px;
  --card-image-y: -13.377px;
}

.yb-department-card--textile {
  --card-image-width: 355.93px;
  --card-image-height: 237.286px;
  --card-image-x: -63.348px;
  --card-image-y: -62.788px;
}

.yb-department-card--product {
  --card-image-width: 397.22px;
  --card-image-height: 264.719px;
  --card-image-x: -83.395px;
  --card-image-y: -81.434px;
}

.yb-department-card--vcd {
  --card-image-width: 289px;
  --card-image-height: 433.5px;
  --card-image-x: -0.5px;
  --card-image-y: -45.89px;
}

.yb-department-card--imd {
  --card-image-width: 302.666px;
  --card-image-height: 199.255px;
  --card-image-x: -1.093px;
  --card-image-y: -8.097px;
}

.yb-department-card--illust {
  --card-image-width: 657.368px;
  --card-image-height: 438.245px;
  --card-image-x: -316.284px;
  --card-image-y: -67.662px;
}

.yb-department-card--anime {
  --card-image-width: 426.345px;
  --card-image-height: 284.352px;
  --card-image-x: -55.989px;
  --card-image-y: -15.794px;
}

.yb-department-card--conserve {
  --card-image-width: 354.224px;
  --card-image-height: 236.15px;
  --card-image-x: -47.992px;
  --card-image-y: -52.466px;
}

.yb-course-detail {
  --course-color: #d80c18;
  --course-tint: #f5a09b;
  --course-label: #eb5555;
  --course-soft: #ffeee9;
  --course-tag-bg: #ffdcd2;
  --course-line: #78d7c8;
  --course-line-dash: #3cc3b4;
  --course-interview-bg: var(--course-line);
  --course-pickup-bg: #f0827c;
  --course-mint: var(--course-line);
  --course-detail-bg: #ffdcd2;
  --course-side-width: max(var(--yb-shell), calc(100vw - var(--yb-shell)));
  --course-right-bg-aspect: 1440 / 2016;
  position: relative;
  background: transparent;
}

.yb-course-detail--paint {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--paint::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/paint/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--paint::before {
  display: none;
}

.yb-course-detail--paint .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/paint/bg-left-outer.webp");
}

.yb-course-detail--paint .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/paint/bg-left-inner.webp");
}

.yb-course-detail--paint .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/paint/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--paint:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/paint/bg-left-front.webp"), url("../img/department/paint/bg-left-inner.webp"), url("../img/department/paint/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--paint .yb-course-detail__interview {
  background-image: url("../img/department/paint/interview-bg.svg");
}

.yb-course-detail--sculpture {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--sculpture::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/sculpture/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--sculpture::before {
  display: none;
}

.yb-course-detail--sculpture .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/sculpture/bg-left-outer.webp");
}

.yb-course-detail--sculpture .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/sculpture/bg-left-inner.webp");
}

.yb-course-detail--sculpture .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/sculpture/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--sculpture:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/sculpture/bg-left-front.webp"), url("../img/department/sculpture/bg-left-inner.webp"), url("../img/department/sculpture/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--sculpture .yb-course-detail__interview {
  background-image: url("../img/department/sculpture/interview-bg.svg");
}

.yb-course-detail--craft {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--craft::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/craft/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--craft::before {
  display: none;
}

.yb-course-detail--craft .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/craft/bg-left-outer.webp");
}

.yb-course-detail--craft .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/craft/bg-left-inner.webp");
}

.yb-course-detail--craft .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/craft/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--craft:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/craft/bg-left-front.webp"), url("../img/department/craft/bg-left-inner.webp"), url("../img/department/craft/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--craft .yb-course-detail__interview {
  background-image: url("../img/department/craft/interview-bg.svg");
}

.yb-course-detail--textile {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--textile::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/textile/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--textile::before {
  display: none;
}

.yb-course-detail--textile .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/textile/bg-left-outer.webp");
}

.yb-course-detail--textile .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/textile/bg-left-inner.webp");
}

.yb-course-detail--textile .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/textile/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--textile:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/textile/bg-left-front.webp"), url("../img/department/textile/bg-left-inner.webp"), url("../img/department/textile/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--textile .yb-course-detail__interview {
  background-image: url("../img/department/textile/interview-bg.svg");
}

.yb-course-detail--product {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--product::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/product/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--product::before {
  display: none;
}

.yb-course-detail--product .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/product/bg-left-outer.webp");
}

.yb-course-detail--product .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/product/bg-left-inner.webp");
}

.yb-course-detail--product .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/product/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--product:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/product/bg-left-front.webp"), url("../img/department/product/bg-left-inner.webp"), url("../img/department/product/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--product .yb-course-detail__interview {
  background-image: url("../img/department/product/interview-bg.svg");
}

.yb-course-detail--vcd {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--vcd::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/vcd/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--vcd::before {
  display: none;
}

.yb-course-detail--vcd .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/vcd/bg-left-outer.webp");
}

.yb-course-detail--vcd .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/vcd/bg-left-inner.webp");
}

.yb-course-detail--vcd .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/vcd/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--vcd:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/vcd/bg-left-front.webp"), url("../img/department/vcd/bg-left-inner.webp"), url("../img/department/vcd/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--vcd .yb-course-detail__interview {
  background-image: url("../img/department/vcd/interview-bg.svg");
}

.yb-course-detail--anime {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--anime::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/anime/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--anime::before {
  display: none;
}

.yb-course-detail--anime .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/anime/bg-left-outer.webp");
}

.yb-course-detail--anime .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/anime/bg-left-inner.webp");
}

.yb-course-detail--anime .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/anime/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--anime:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/anime/bg-left-front.webp"), url("../img/department/anime/bg-left-inner.webp"), url("../img/department/anime/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--anime .yb-course-detail__interview {
  background-image: url("../img/department/anime/interview-bg.svg");
}

.yb-course-detail--imd {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--imd::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/imd/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--imd::before {
  display: none;
}

.yb-course-detail--imd .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/imd/bg-left-outer.webp");
}

.yb-course-detail--imd .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/imd/bg-left-inner.webp");
}

.yb-course-detail--imd .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/imd/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--imd:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/imd/bg-left-front.webp"), url("../img/department/imd/bg-left-inner.webp"), url("../img/department/imd/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--imd .yb-course-detail__interview {
  background-image: url("../img/department/imd/interview-bg.svg");
}

.yb-course-detail--illust {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--illust::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/illust/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--illust::before {
  display: none;
}

.yb-course-detail--illust .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/illust/bg-left-outer.webp");
}

.yb-course-detail--illust .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/illust/bg-left-inner.webp");
}

.yb-course-detail--illust .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/illust/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--illust:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/illust/bg-left-front.webp"), url("../img/department/illust/bg-left-inner.webp"), url("../img/department/illust/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--illust .yb-course-detail__interview {
  background-image: url("../img/department/illust/interview-bg.svg");
}

.yb-course-detail--conserve {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-course-detail--conserve::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/conserve/bg-right.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-course-detail--conserve::before {
  display: none;
}

.yb-course-detail--conserve .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/conserve/bg-left-outer.webp");
}

.yb-course-detail--conserve .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/conserve/bg-left-inner.webp");
}

.yb-course-detail--conserve .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/conserve/bg-left-front.webp");
}

/* Legacy fallback before the layered markup loads. */
.yb-course-detail--conserve:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/conserve/bg-left-front.webp"), url("../img/department/conserve/bg-left-inner.webp"), url("../img/department/conserve/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-course-detail--conserve .yb-course-detail__interview {
  background-image: url("../img/department/conserve/interview-bg.svg");
}

.yb-course-detail__left-bg {
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  overflow: hidden;
  pointer-events: none;
}

.yb-course-detail__left-bg-stage {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--yb-course-bg-stage-w);
  min-height: 100%;
  aspect-ratio: 720/811;
}

.yb-course-detail__left-bg-layer {
  position: absolute;
  background-position: right top;
  background-repeat: no-repeat;
}

.yb-course-detail__left-bg-layer--outer,
.yb-course-detail__left-bg-layer--front {
  inset: 0;
  background-size: 100% 100%;
}

.yb-course-detail__left-bg-layer--outer {
  z-index: 0;
}

.yb-course-detail__left-bg-layer--inner {
  z-index: 1;
  inset: 36px;
  background-position: right calc(var(--yb-course-bg-stage-inset) - 36px) top calc(var(--yb-course-bg-stage-inset) - 36px);
  background-size: calc(var(--yb-course-bg-stage-w) * 648 / 720) auto;
}

.yb-course-detail__left-bg-layer--front {
  z-index: 2;
}

.yb-course-detail__left-title {
  position: fixed;
  z-index: 2;
  top: calc(var(--yb-course-side-top) + 72px);
  right: min(100vw, var(--yb-shell));
  width: var(--course-side-width);
  margin: 0;
  padding: 16px 72px;
  pointer-events: none;
}

.yb-course-detail:has(.yb-course-detail__left-bg) .yb-course-detail__left-title {
  width: max(0px, 100vw - var(--yb-shell));
}

@media (min-width: 1440px) {
  .yb-course-detail__left-title {
    top: calc(var(--yb-course-side-top) + 5vw);
    padding-left: 5vw;
  }
}
@media (max-width: 1440px) and (min-height: 810px) {
  .yb-course-detail__left-title {
    top: calc(var(--yb-course-side-top) + 8.8vh);
  }
}
.yb-course-detail__left-title-meta {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 0 12px;
  color: var(--yb-black);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}
.yb-course-detail__left-title-meta span {
  background-color: #fff;
}

.yb-course-detail__left-title i {
  display: block;
  width: 16px;
  height: 13px;
  background: var(--course-color);
  clip-path: polygon(46% 0, 54% 0, 54% 100%, 46% 100%);
}

.yb-course-detail__left-title em {
  background-color: #fff;
  color: var(--course-color);
  font-family: var(--yb-font-en);
  font-style: normal;
}

.yb-course-detail__left-title strong {
  display: inline;
  background-color: #fff;
  color: var(--yb-black);
  font-size: 36px;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.4;
}

.yb-course-detail--vcd .yb-course-detail__left-title strong {
  font-size: 28px;
  font-feature-settings: "palt" on;
}

.yb-course-detail__inner {
  position: relative;
  z-index: 1;
  padding: 36px 0 96px;
  background: transparent;
}

.yb-course-detail__content {
  width: 624px;
  margin: 0 auto;
  padding-bottom: 48px;
  background: var(--yb-white);
}

.yb-course-detail__hero {
  position: relative;
  width: 624px;
  margin: 0 auto;
  padding: 0;
  background: linear-gradient(135deg, color-mix(in srgb, var(--course-mint) 90%, #ffffff) 0 154px, transparent 154px 100%) left top/292px 240px no-repeat, linear-gradient(155deg, transparent 0 48%, color-mix(in srgb, var(--course-color) 85%, #ffffff) 48% 57%, transparent 57% 100%) right -32px top 0.5555555556 236px no-repeat, linear-gradient(135deg, transparent 0 70%, color-mix(in srgb, var(--course-tint) 72%, #ffffff) 70% 84%, transparent 84% 100%) right -8px bottom 0.0533333333 260px no-repeat, color-mix(in srgb, var(--course-soft) 78%, #ffffff);
}

.yb-course-detail__hero-card {
  position: relative;
  z-index: 1;
  width: 624px;
  padding: 48px 48px 0;
  background: var(--yb-white);
}

.yb-course-detail__hero-card p,
.yb-course-detail__hero-card h1,
.yb-course-detail__hero-card h2,
.yb-course-detail__hero-card figure {
  margin: 0;
}

.yb-course-detail__hero-card h1,
.yb-course-detail__hero-card h2 {
  margin-top: 0;
  color: #131313;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-course-detail__hero-card > p {
  margin-top: 32px;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-course-detail__curriculum-note {
  margin: 48px 0 24px;
  padding: 16px;
  border: 1px solid currentColor;
  background: var(--yb-white);
  color: var(--course-color);
}

.yb-course-detail__curriculum-note p {
  margin: 0;
  color: inherit;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-course-detail__curriculum-note p + p {
  margin-top: 16px;
}

.yb-course-detail__curriculum-note strong {
  color: inherit;
  font-weight: 700;
}

.yb-course-detail__hero-card figure {
  width: 624px;
  height: 240px;
  margin: 48px -48px 0;
  overflow: hidden;
  border-radius: 0;
}

.yb-course-detail__hero-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-course-detail__side-title {
  position: absolute;
  right: -4px;
  bottom: 24px;
  color: var(--course-color);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 200;
  letter-spacing: 0.1em;
  line-height: 1;
  writing-mode: vertical-rl;
}

.yb-course-detail__tags {
  display: grid;
  gap: 24px;
  width: 528px;
  margin: 48px auto 0;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--course-line);
}

.yb-course-detail__tag-row {
  display: grid;
  grid-template-columns: 144px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.yb-course-detail__tag-row:first-child {
  padding-bottom: 24px;
  border-bottom: 1px dashed var(--course-line-dash);
}

.yb-course-detail__tag-row h2,
.yb-course-detail__tag-row p {
  margin: 0;
}

.yb-course-detail__tag-row h2 {
  color: #111827;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-course-detail__tag-row ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-course-detail__tag-row li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 24px;
  padding: 4px 10px;
  border: 1px solid var(--course-tint);
  border-radius: 4px;
  background: var(--course-tag-bg);
  color: #656464;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.yb-course-detail__tag-row p {
  grid-column: 2;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-course-detail__small-button,
.yb-course-detail__large-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--course-label);
  background: var(--yb-white);
  color: var(--course-label);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-course-detail__small-button {
  grid-column: 2;
  width: fit-content;
  min-width: 270px;
  min-height: 32px;
  padding: 8px 16px;
  border-radius: 16px;
  font-size: 14px;
}

.yb-course-detail__large-button {
  width: 304px;
  min-height: 60px;
  margin: 0 auto;
  padding: 10px 32px;
  border-radius: 30px;
  font-size: 20px;
}

.yb-course-detail__small-button::after,
.yb-course-detail__large-button::after {
  content: "→";
  flex: 0 0 auto;
  margin-left: 16px;
  font-family: var(--yb-font-en);
  letter-spacing: 0;
}

.yb-course-detail__section {
  width: 528px;
  margin: 48px auto 0;
}

.yb-course-detail__section-heading {
  display: grid;
  gap: 10px;
  margin-bottom: 24px;
}

.yb-course-detail__section-heading h2,
.yb-course-detail__section-heading p {
  margin: 0;
}

.yb-course-detail__section-heading h2,
.yb-course-detail__line-heading h2 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.3;
}

.yb-course-detail__section-heading p {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-course-detail__year {
  overflow: visible;
  background: var(--course-soft);
}

.yb-course-detail__year + .yb-course-detail__year {
  margin-top: 48px;
}

.yb-course-detail__year + .yb-course-detail__year--connected {
  margin-top: 0;
}

.yb-course-detail__year--connected .yb-course-detail__year-slides {
  height: 352px;
}

.yb-course-detail__year-image {
  position: relative;
  height: 379px;
  margin: 0;
}

.yb-course-detail__year:first-of-type .yb-course-detail__year-image {
  height: 220px;
  overflow: hidden;
}

.yb-course-detail__year-slides {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 352px;
  overflow: hidden;
  background: transparent;
}

.yb-course-detail__year:first-of-type .yb-course-detail__year-slides {
  height: 220px;
}

.yb-course-detail__year-image img,
.yb-course-detail__year-image video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.45s ease;
}

.yb-course-detail__year-image img.is-active,
.yb-course-detail__year-image video.is-active {
  opacity: 1;
}

.yb-course-detail__year-label,
.yb-course-detail__year-major-label {
  color: var(--yb-white);
  font-family: var(--yb-font-en);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.1;
}

.yb-course-detail__year-label {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  align-items: center;
}

.yb-course-detail__year-major-label {
  display: flex;
  width: 100%;
}

.yb-course-detail__year-label span,
.yb-course-detail__year-major-label span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 16px;
}

.yb-course-detail__year-major-label span {
  width: 100%;
}

.yb-course-detail__year-label-text,
.yb-course-detail__year-label-year {
  background: var(--course-label);
}

.yb-course-detail__year-label-major {
  background: var(--course-color);
}

.yb-course-detail__year-label-text::first-letter,
.yb-course-detail__year-label-year::first-letter {
  margin-right: 2px;
  font-size: 18px !important;
}

.yb-course-detail__year-image figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  min-height: 19px;
  margin: 0;
  padding-right: 24px;
  color: #474b4e;
  font-size: 11px;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-course-detail__year-controls {
  position: absolute;
  top: 156px;
  left: -20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 568px;
  color: var(--course-label);
  font-family: var(--yb-font-en);
  line-height: 1;
}

.yb-course-detail__year-controls button {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid var(--course-label);
  border-radius: 50%;
  background: var(--yb-white);
  color: var(--course-label);
  cursor: pointer;
  font-family: var(--yb-font-en);
  font-size: 14px;
  line-height: 1;
}

.yb-course-detail__year-controls button::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("../img/common/arrow-black.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.yb-course-detail__year-controls button[data-yb-course-year-prev]::before {
  transform: rotate(180deg);
}

.yb-course-detail__year-controls p {
  min-width: 36px;
  margin: 0;
  font-size: 12px;
  text-align: center;
}

.yb-course-detail__year-controls strong,
.yb-course-detail__year-controls em {
  font-style: normal;
  font-weight: 500;
}

.yb-course-detail__year-body {
  padding: 48px 24px 32px;
}

.yb-course-detail__year-body h3,
.yb-course-detail__year-body p {
  margin: 0;
}

.yb-course-detail__year-body h3 {
  color: #000000;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-course-detail__year-body > p {
  margin-top: 12px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-course-detail__year-body > .yb-course-detail__small-button {
  margin-top: 18px;
}

.yb-course-detail__subject-list {
  display: grid;
  gap: 2px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.yb-course-detail__subject-list li {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  min-height: 114px;
  padding: 12px;
  background: var(--yb-white);
}

.yb-course-detail__subject-list li:first-child {
  border-radius: 8px 8px 0 0;
}

.yb-course-detail__subject-list li:last-child {
  border-radius: 0 0 8px 8px;
}

.yb-course-detail__subject-list img {
  width: 120px;
  height: 90px;
  border-radius: 6px;
  object-fit: cover;
}

.yb-course-detail__subject-list span,
.yb-course-detail__subject-list strong,
.yb-course-detail__subject-list em {
  display: block;
}

.yb-course-detail__subject-list strong {
  color: #131313;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5;
}

.yb-course-detail__subject-list em {
  margin-top: 6px;
  color: #474b4e;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-first-year {
  --first-year-blue-light: #66c6f2;
  --first-year-blue-soft: #e6f6fd;
  --first-year-blue-pale: #f2fafe;
  --first-year-blue-border: #80d0f4;
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
}

.yb-first-year::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/department/1st-specialized-subjects/right-img.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-first-year::before {
  display: none;
}

.yb-first-year .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/department/1st-specialized-subjects/bg-left-outer.webp");
}

.yb-first-year .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/department/1st-specialized-subjects/bg-left-inner.webp");
}

.yb-first-year .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/department/1st-specialized-subjects/bg-left-front.webp");
}

.yb-first-year:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/department/1st-specialized-subjects/bg-left-front.webp"), url("../img/department/1st-specialized-subjects/bg-left-inner.webp"), url("../img/department/1st-specialized-subjects/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-first-year__inner {
  position: relative;
  z-index: 1;
  padding: 36px 0 96px;
}

.yb-first-year__content {
  width: 624px;
  margin: 0 auto;
  padding-bottom: 48px;
  background: var(--yb-white);
}

.yb-first-year__intro {
  width: 624px;
  padding: 48px 48px 24px;
  background: var(--yb-white);
}

.yb-first-year__intro h1,
.yb-first-year__intro p {
  margin: 0;
}

.yb-first-year__intro h1 {
  color: #131313;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-first-year__intro-en {
  margin-top: 12px !important;
  color: #131313;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-first-year__lead {
  margin-top: 24px !important;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-first-year__subject-index {
  margin-top: 32px;
  padding: 24px 0 0;
  border-bottom: 1px solid var(--yb-line);
}

.yb-first-year__subject-index p {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #131313;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-first-year__subject-index p::after {
  content: "";
  flex: 1 1 auto;
  border-top: 1px solid var(--yb-line);
}

.yb-first-year__subject-index div {
  display: grid;
  gap: 24px;
  margin-top: 24px;
}

.yb-first-year__subject-index a {
  --yb-first-year-index-icon-color: currentColor;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 17px;
  gap: 8px 10px;
  align-items: center;
  min-height: 82px;
  padding: 0 0 24px 2px;
  color: #131313;
  text-decoration: none;
  transition: border-color 0.18s ease;
}

.yb-first-year__subject-index a:not(:last-child) {
  border-bottom: 1px dashed var(--first-year-blue-border);
}

.yb-first-year__subject-index a::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--yb-blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.28s ease;
}

.yb-first-year__subject-index a::after {
  content: "";
  display: inline-flex;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  background-color: var(--yb-first-year-index-icon-color);
  mask: url("../img/common/arrow-black.svg") center/contain no-repeat;
  -webkit-mask: url("../img/common/arrow-black.svg") center/contain no-repeat;
  transform: rotate(90deg);
  transition: background-color 0.18s ease;
}

.yb-first-year__subject-index a:hover,
.yb-first-year__subject-index a:focus-visible {
  --yb-first-year-index-icon-color: var(--yb-blue);
  border-bottom-color: var(--yb-blue);
}

.yb-first-year__subject-index a:hover::before,
.yb-first-year__subject-index a:focus-visible::before {
  transform: scaleX(1);
}

.yb-first-year__subject-index strong {
  display: block;
  grid-column: 1/-1;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
}

.yb-first-year__subject-index span {
  display: flex;
  flex-wrap: wrap;
  grid-column: 1;
  gap: 8px;
}

.yb-first-year__subject-index i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 10px;
  border: 1px solid var(--first-year-blue-border);
  border-radius: 4px;
  background: var(--first-year-blue-soft);
  color: #656464;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.yb-first-year__curriculum {
  width: 528px;
  margin: 48px auto 0;
}

.yb-first-year__curriculum + .yb-first-year__curriculum {
  margin-top: 72px;
}

.yb-first-year__section-heading {
  display: grid;
  gap: 10px;
  margin-bottom: 24px;
}

.yb-first-year__section-heading h2,
.yb-first-year__section-heading p {
  margin: 0;
}

.yb-first-year__section-heading h2 {
  color: #131313;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-first-year__section-heading p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-first-year__diagram {
  background: var(--first-year-blue-pale);
}

.yb-first-year__diagram h3 {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  margin: 0;
  padding: 6px 16px;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-first-year__diagram figure {
  margin: 0;
  padding: 26px 16px 32px;
}

.yb-first-year__diagram img {
  display: block;
  width: 318px;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

.yb-first-year__diagram figcaption {
  display: grid;
  gap: 10px;
  margin: 42px 0 0;
  padding: 24px;
  border-radius: 8px;
  background: var(--yb-white);
}

.yb-first-year__diagram strong,
.yb-first-year__diagram span {
  display: block;
}

.yb-first-year__diagram strong {
  color: var(--yb-blue);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-first-year__diagram span {
  color: var(--yb-blue);
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-first-year__subject {
  margin-top: 48px;
  background: var(--first-year-blue-soft);
}

.yb-first-year__subject-visual {
  position: relative;
  margin: 0;
}

.yb-first-year__subject-slides {
  position: relative;
  height: 352px;
  overflow: hidden;
}

.yb-first-year__subject-slides img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  opacity: 0;
  transition: opacity 0.45s ease;
}

.yb-first-year__subject-slides img.is-active {
  opacity: 1;
}

.yb-first-year__subject-label {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  color: var(--yb-white);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-first-year__subject-label span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 16px;
}

.yb-first-year__subject-label span:first-child {
  background: var(--yb-blue);
}

.yb-first-year__subject-label span:last-child {
  background: var(--first-year-blue-light);
}

.yb-first-year__subject-controls {
  position: absolute;
  top: 156px;
  left: -20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 568px;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  line-height: 1;
}

.yb-first-year__subject-controls button {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid var(--yb-blue);
  border-radius: 50%;
  background: var(--yb-white);
  color: var(--yb-blue);
  cursor: pointer;
}

.yb-first-year__subject-controls button::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("../img/common/arrow-black.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.yb-first-year__subject-controls button[data-yb-course-year-prev]::before {
  transform: rotate(180deg);
}

.yb-first-year__subject-controls p {
  min-width: 36px;
  margin: 0;
  font-size: 12px;
  text-align: center;
}

.yb-first-year__subject-controls strong,
.yb-first-year__subject-controls em {
  font-style: normal;
  font-weight: 500;
}

.yb-first-year__subject-visual figcaption {
  display: flex;
  justify-content: flex-end;
  min-height: 20px;
  margin: 8px 0 0;
  padding: 0 24px;
  color: #474b4e;
  font-size: 11px;
  letter-spacing: 0.05em;
  line-height: 1.4;
  text-align: right;
}

.yb-first-year__subject-body {
  padding: 24px 24px 32px;
}

.yb-first-year__subject-body h3,
.yb-first-year__subject-body p {
  margin: 0;
}

.yb-first-year__subject-body h3 {
  color: #131313;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-first-year__subject-body > p {
  margin-top: 12px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-first-year__subject-list {
  display: grid;
  gap: 2px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.yb-first-year__subject-list li {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  min-height: 114px;
  padding: 12px;
  background: var(--yb-white);
}

.yb-first-year__subject-list li:first-child {
  border-radius: 8px 8px 0 0;
}

.yb-first-year__subject-list li:last-child {
  border-radius: 0 0 8px 8px;
}

.yb-first-year__subject-list img {
  display: block;
  width: 120px;
  height: 90px;
  border-radius: 6px;
  object-fit: cover;
}

.yb-first-year__subject-list span,
.yb-first-year__subject-list strong,
.yb-first-year__subject-list em {
  display: block;
}

.yb-first-year__subject-list strong {
  color: #131313;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5;
}

.yb-first-year__subject-list em {
  margin-top: 6px;
  color: #474b4e;
  font-size: 14px;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-course-detail__pickup {
  margin-top: 48px;
  padding: 24px;
  background: var(--course-pickup-bg);
  color: var(--yb-black);
  clip-path: polygon(24px 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%, 0 24px);
}

.yb-course-detail__pickup h3 {
  display: flex;
  justify-content: center;
  margin: 0 0 24px;
  text-align: center;
}

.yb-course-detail__pickup h3 img {
  display: block;
  width: 178px;
  height: auto;
}

.yb-course-detail__pickup figure {
  width: 480px;
  height: 340px;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
}

.yb-course-detail__pickup figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-course-detail__pickup-body {
  display: grid;
  grid-template-columns: 202px minmax(0, 1fr);
  gap: 24px;
  margin-top: 24px;
}

.yb-course-detail__pickup-body h4,
.yb-course-detail__pickup-body p {
  margin: 0;
}

.yb-course-detail__pickup-body h4 {
  color: #474b4e;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-course-detail__pickup-body div > p {
  margin-top: 12px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-course-detail__pickup-body > p {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-course-detail__pickup-point {
  display: grid;
  grid-column: 1/-1;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 16px;
  margin-top: 8px;
  padding: 16px;
  border-radius: 8px;
  background: var(--yb-white);
}

.yb-course-detail__pickup-point strong {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--course-pickup-bg);
  color: var(--yb-white);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.4;
  text-align: left;
  min-width: 88px;
}

.yb-course-detail__pickup-point ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-course-detail__pickup-point li {
  position: relative;
  padding-left: 18px;
}

.yb-course-detail__pickup-point li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--course-pickup-bg);
}

.yb-course-detail__faculty {
  padding-top: 48px;
  border-top: 1px solid var(--course-line);
}

.yb-course-detail__faculty-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-course-detail__faculty-cards li {
  min-width: 0;
}

.yb-course-detail__faculty-cards img {
  display: block;
  width: 160px;
  height: 120px;
  border: 0;
  object-fit: cover;
}

.yb-course-detail__faculty-cards h3,
.yb-course-detail__faculty-cards p {
  margin: 0;
}

.yb-course-detail__faculty-cards h3 {
  margin-top: 24px;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-course-detail__faculty-cards .en {
  margin-top: 8px;
  color: #474b4e;
  font-family: var(--yb-font-en);
  font-size: 12px;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-course-detail__faculty-cards p:not(.en) {
  margin-top: 16px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-course-detail__faculty-table {
  overflow: hidden;
  margin-top: 48px;
  border: 1px solid var(--course-label);
  border-radius: 8px;
}

.yb-course-detail__faculty-table h3,
.yb-course-detail__faculty-table p {
  margin: 0;
}

.yb-course-detail__faculty-table h3 {
  padding: 16px 24px;
  background: var(--course-soft);
  color: var(--course-label);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.yb-course-detail__faculty-table > div:not(.yb-course-detail__faculty-table-body) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 16px 24px;
  border-top: 1px solid var(--yb-border);
}

.yb-course-detail__faculty-table-body {
  padding: 0;
}

.yb-course-detail__faculty-table-body table {
  margin: 0;
  width: 100%;
  border-collapse: collapse;
}

.yb-course-detail__faculty-table-body caption,
.yb-course-detail__faculty-table-body thead {
  display: none;
}

.yb-course-detail__faculty-table-body th,
.yb-course-detail__faculty-table-body td {
  padding: 12px 0 12px 24px !important;
  border-top: 1px solid var(--yb-border);
  color: #474b4e;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.4;
  text-align: left;
}

.yb-course-detail__faculty-table-body tr:first-child th,
.yb-course-detail__faculty-table-body tr:first-child td {
  border-top: 0;
}

.yb-course-detail__faculty-table p {
  color: #474b4e;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.yb-course-detail__faculty .yb-course-detail__large-button {
  margin-top: 48px;
  margin-right: auto;
  margin-left: auto;
}

.yb-course-detail__interview {
  position: relative;
  width: 624px;
  margin: 96px auto 0;
  padding: 48px 48px 96px;
  overflow: hidden;
  background-color: var(--course-interview-bg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.yb-course-detail__interview-title {
  position: relative;
  z-index: 1;
  display: block;
  width: 195px;
  height: auto;
}

.yb-course-detail__interview-group {
  position: relative;
  z-index: 1;
  margin-top: 32px;
}
.yb-course-detail__interview-group + .yb-course-detail__interview-group {
  margin-top: 64px;
}

.yb-course-detail__line-heading {
  display: flex;
  align-items: center;
  gap: 24px;
}

.yb-course-detail__line-heading::after {
  content: "";
  height: 1px;
  flex: 1;
  background: var(--course-line-dash);
}

.yb-course-detail__line-heading h2 {
  margin: 0;
}

.yb-course-detail__interview-list {
  display: grid;
  grid-template-columns: repeat(2, 248px);
  gap: 32px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.yb-course-detail__interview-list--single {
  grid-template-columns: 248px;
  justify-content: center;
}

.yb-course-detail__interview-list li {
  position: relative;
  display: flex;
  width: 248px;
  min-height: 400px;
  flex-direction: column;
  align-items: center;
  padding: 42px 24px 24px;
  border: 1px solid var(--course-line-dash);
  border-radius: 142px;
  background: var(--course-soft);
  text-align: center;
  overflow: hidden;
}

.yb-course-detail__interview-card-link {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  color: inherit;
}

.yb-course-detail__interview-course {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.yb-course-detail__interview-label {
  position: absolute;
  top: -1px;
  left: -1px;
  z-index: 2;
  width: calc(100% + 2px);
  height: auto;
  pointer-events: none;
}

.yb-course-detail__interview-photo {
  display: block;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: var(--yb-white);
  box-shadow: 0 0 0 4px var(--yb-white), 0 0 0 5px var(--yb-black);
  object-fit: cover;
}

.yb-course-detail__interview-list .name {
  width: fit-content;
  margin: 10px auto 0;
  padding: 8px 14px;
  border-radius: 15px;
  background: var(--yb-white);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-course-detail__interview-list .name span,
.yb-course-detail__interview-list .role {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 400;
}

.yb-course-detail__interview-list .role {
  margin: 10px 0 0;
  color: #474b4e;
  letter-spacing: 0.05em;
}

.yb-course-detail__interview-list .message {
  display: grid;
  gap: 2px;
  margin: 8px 0 0;
  font-family: var(--yb-font-hand);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.6;
}

.yb-course-detail__interview-list .message span {
  text-decoration: underline wavy var(--course-color) 1px;
  text-underline-offset: 4px;
}

.yb-course-detail__interview .yb-course-detail__large-button {
  margin-top: 32px;
  margin-right: auto;
  margin-left: auto;
}

.yb-course-detail__virtual-link {
  display: block;
  width: 100%;
  overflow: hidden;
}

.yb-course-detail__virtual-frame {
  width: 100%;
  aspect-ratio: 528/294.8;
  overflow: hidden;
  background: var(--yb-border);
}

.yb-course-detail--paint .yb-course-detail__virtual-frame {
  background: url("../img/department/paint/figma/virtual-campus.png") center/cover no-repeat;
}

.yb-course-detail__virtual-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.yb-course-detail__blog-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 248px));
  gap: 32px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.yb-course-detail__blog-list img {
  display: block;
  width: 248px;
  height: 186px;
  border: 1px solid var(--yb-border);
  object-fit: cover;
}

.yb-course-detail__blog-list a {
  display: block;
  color: inherit;
}

.yb-course-detail__blog-list h3,
.yb-course-detail__blog-list p,
.yb-course-detail__blog-list time {
  display: block;
  margin: 0;
}

.yb-course-detail__blog .yb-course-detail__large-button {
  margin-top: 40px;
}

.yb-course-detail__blog-list h3 {
  margin-top: 24px;
  min-height: 54px;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-course-detail__blog-list p {
  margin-top: 12px;
  color: #131313;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.yb-course-detail__blog-list time {
  margin-top: 12px;
  color: #474b4e;
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

.yb-senpai-index {
  position: relative;
  isolation: isolate;
  background: transparent;
}

.yb-senpai-index__inner {
  position: relative;
  width: 100%;
  min-height: 3492px;
  margin-left: 0;
  padding: 40px 48px 96px;
}

.yb-senpai-index__visual {
  background: #e6e6e6;
}

.yb-senpai-index__visual-sticky {
  position: fixed;
  top: var(--yb-fixed-bg-top);
  left: 0;
  right: var(--yb-shell);
  width: auto;
  height: calc(100vh - var(--yb-fixed-bg-top));
  overflow: hidden;
  transition: top 0.28s ease, height 0.28s ease;
}

.yb-senpai-index__visual-slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.yb-senpai-index__visual-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.2s ease;
}

.yb-senpai-index__visual-slide.is-active {
  opacity: 1;
}

.yb-senpai-index__visual-sticky img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-senpai-index__content {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  background: #fff url("../img/about/speciality/senpai/bg-index.svg") right var(--yb-header)/min(720px, 100%) auto no-repeat;
  background-attachment: fixed;
}

.yb-senpai-index__heading {
  position: absolute;
  left: 46px;
  top: 40px;
  z-index: 2;
  width: 251px;
}

.yb-senpai-index__heading h1 {
  margin: 0;
}

.yb-senpai-index__heading h1 {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.45;
}

.yb-senpai-index__lead {
  margin-top: 16px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.05em;
}

.yb-senpai-index__heading .yb-senpai-index__heading-en {
  margin-top: 8px;
  color: #131313;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-senpai-index__list {
  display: grid;
  grid-auto-flow: row dense;
  grid-template-columns: repeat(2, 280px);
  gap: 72px 40px;
  width: 600px;
  margin: 0 0 0 12px;
  padding: 0;
  list-style: none;
}

.yb-senpai-index__list--ends-left {
  padding-bottom: 200px;
}

.yb-senpai-index-card {
  position: relative;
  width: 280px;
  min-height: 552px;
}

.yb-senpai-index__list .yb-senpai-index-card:nth-child(odd) {
  grid-column: 2;
}

.yb-senpai-index__list .yb-senpai-index-card:nth-child(even) {
  grid-column: 1;
  transform: translateY(200px);
}

.yb-senpai-index-card a {
  position: relative;
  display: block;
  width: 280px;
  height: 520px;
  padding-top: 48px;
  overflow: visible;
  border: 1px solid var(--yb-black);
  border-radius: 160px;
  background: var(--senpai-card-bg, var(--senpai-tint));
  color: var(--yb-black);
}

.yb-senpai-index-card__course {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.yb-senpai-index-card__label {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 2;
  pointer-events: none;
}

.yb-senpai-index-card__photo {
  width: 182px;
  height: 182px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 50%;
  background: var(--yb-white);
  box-shadow: 0 0 0 4px var(--yb-white), 0 0 0 5px var(--yb-black);
}

.yb-senpai-index-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-senpai-index-card__name {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 240px;
  min-height: 36px;
  margin: 16px auto 0;
  padding: 8px 16px;
  border-radius: 18px;
  background: var(--yb-white);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.yb-senpai-index-card__name small {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
}
.yb-senpai-index-card__name small .yb-senpai-index-card__grade {
  margin-left: 4px;
  font-size: 16px;
}

.yb-senpai-index-card__name--long {
  font-size: 13px;
  letter-spacing: 0.03em;
}
.yb-senpai-index-card__name--long .yb-senpai-index-card__suffix {
  font-size: 10px;
}
.yb-senpai-index-card__name--long small {
  font-size: 10px;
}
.yb-senpai-index-card__name--long small .yb-senpai-index-card__grade {
  font-size: 13px;
}

.yb-senpai-index-card__suffix {
  margin-top: 0.25em;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.yb-senpai-index-card__at-time {
  font-weight: 400;
}

.yb-senpai-index-card__message {
  display: block;
  min-height: 160px;
  margin: 16px 0 0;
  padding: 8px 8px;
  font-family: var(--yb-font-hand);
  font-size: 28px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1.6;
  text-align: center;
}

.yb-senpai-index-card__message span {
  display: block;
  width: auto;
  max-width: 100%;
  margin-top: 0;
  overflow-wrap: anywhere;
  text-decoration: underline wavy var(--senpai-color) 1px;
  text-underline-offset: 4px;
}

.yb-senpai-index-card__message span + span {
  margin-top: 2px;
}

.yb-senpai-index-card__more {
  position: absolute;
  left: 50%;
  bottom: -32px;
  display: grid;
  width: 64px;
  height: 64px;
  border: 1px solid var(--yb-black);
  border-radius: 50%;
  transform: translateX(-50%);
  background: var(--yb-white);
  place-items: center;
}

.yb-senpai-index-card__more::after {
  content: "";
  width: 16px;
  height: 16px;
  background: var(--yb-black);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-senpai-index__links {
  display: grid;
  grid-template-columns: repeat(2, 304px);
  gap: 16px;
  margin-top: 48px;
}

.yb-senpai-index__list--ends-left + .yb-senpai-index__links {
  margin-top: 72px;
}

.yb-senpai-index__links a {
  position: relative;
  display: flex;
  align-items: center;
  height: 60px;
  padding: 0 56px 0 24px;
  border: 1px solid var(--yb-black);
  border-radius: 30px;
  background: var(--yb-white);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-senpai-index__links a::after,
.yb-senpai-detail__course-link::after {
  content: "";
  position: absolute;
  right: 24px;
  bottom: 18px;
  width: 16px;
  height: 16px;
  background: var(--yb-black);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-senpai-detail {
  --yb-senpai-detail-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-senpai-detail-bg-left-h: calc(100vh - var(--yb-fixed-bg-top));
  --yb-senpai-detail-bg-stage-w: max(var(--yb-shell), var(--yb-senpai-detail-bg-left-w), calc(var(--yb-senpai-detail-bg-left-h) * 720 / 812));
  position: relative;
  overflow: hidden;
  background: transparent;
}

.yb-senpai-detail__visual {
  background: #e6e6e6;
}

.yb-senpai-detail__visual-sticky {
  position: fixed;
  top: var(--yb-fixed-bg-top);
  left: 0;
  right: var(--yb-shell);
  width: auto;
  height: calc(100vh - var(--yb-fixed-bg-top));
  overflow: hidden;
}

.yb-senpai-detail:not(.yb-senpai-detail--teacher) .yb-senpai-detail__visual-sticky::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: var(--yb-senpai-detail-bg-stage-w);
  min-height: 100%;
  aspect-ratio: 720/812;
  background: url("../img/about/speciality/senpai/bg-left-front.svg") right top/100% 100% no-repeat;
  pointer-events: none;
}

.yb-senpai-detail__visual-sticky img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-senpai-detail__content {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  background-color: var(--senpai-bg-color, #ebcdcd);
  background-image: var(--senpai-bg-image, url("../img/about/speciality/senpai/bg-detail-conserve.svg"));
  background-position: right calc(var(--yb-shell) - var(--yb-senpai-detail-bg-stage-w)) top var(--yb-fixed-bg-top);
  background-size: var(--yb-senpai-detail-bg-stage-w) auto;
  background-repeat: no-repeat;
  background-attachment: fixed;
  position: relative;
}

.yb-senpai-detail__inner {
  width: 100%;
  margin-left: 0;
  padding: 40px 48px 96px;
}

.yb-senpai-detail__side-title {
  position: absolute;
  top: 16px;
  right: 12px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 24px;
  height: 720px;
  padding-top: 6px;
  writing-mode: vertical-rl;
  pointer-events: none;
  mix-blend-mode: exclusion;
}

.yb-senpai-detail__side-title span,
.yb-senpai-detail__side-title em {
  color: var(--senpai-label-color, var(--senpai-color));
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
}

.yb-senpai-detail__side-title em {
  font-family: var(--yb-font-jp);
  font-size: 14px;
  text-orientation: upright;
}
.yb-senpai-detail__side-title em .combine {
  margin-top: 8px;
  font-family: var(--yb-font-en);
  text-combine-upright: all;
}

.yb-senpai-detail__side-title i {
  display: block;
  width: 1px;
  height: 388px;
  background: var(--senpai-label-color, var(--senpai-color));
}

.yb-senpai-detail__hero {
  padding: 44px 0 56px;
}

.yb-senpai-detail__label {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 192px;
  min-height: 32px;
  margin: 0;
  padding-bottom: 2px;
  color: var(--senpai-color);
  background: url("../img/about/speciality/senpai/senpai-detail-side-title-frame.svg") center/100% 100% no-repeat;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-senpai-detail__label small {
  font-family: var(--yb-font-en);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
}

.yb-senpai-detail__hero h1 {
  max-width: 576px;
  margin: 48px auto 0;
  font-family: var(--yb-font-hand);
  font-size: 48px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1.6;
  text-align: center;
}

.yb-senpai-detail__hero-title-line {
  position: relative;
  display: inline;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  padding-bottom: 12px;
  background-image: var(--senpai-wave-image);
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: auto 8px;
}

.yb-senpai-detail__profile {
  position: relative;
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 24px;
  align-items: center;
  width: 100%;
  max-width: 576px;
  min-height: 128px;
  margin-top: 72px;
  padding: 12px 20px;
  border: 1px solid var(--yb-black);
  border-radius: 999px;
  background: var(--senpai-profile-bg, var(--senpai-tint));
  overflow: visible;
}

.yb-senpai-detail__profile-course-label {
  position: absolute;
  top: -36px;
  left: 0;
  z-index: 1;
  width: 640px;
  height: 200px;
  margin: 0;
  pointer-events: none;
}

.yb-senpai-detail__profile-course-label img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yb-senpai-detail__profile-photo {
  position: relative;
  display: block;
  z-index: 2;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--yb-white);
  box-shadow: 0 0 0 3.2px var(--yb-white), 0 0 0 4px var(--yb-black);
  object-fit: cover;
}

.yb-senpai-detail__profile-text {
  position: relative;
  z-index: 2;
}

.yb-senpai-detail__profile p {
  color: var(--yb-white);
  line-height: 1;
}

.yb-senpai-detail__profile-name {
  margin: 0;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.yb-senpai-detail__profile-name span {
  display: inline;
  margin-left: 12px;
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.yb-senpai-detail__profile-course-grade {
  margin: 16px 0 0 0;
  font-size: 14px;
  font-weight: 400;
}

.yb-senpai-detail__profile-at-time {
  font-size: 12px;
  font-weight: 400;
}

.yb-senpai-detail__profile-school {
  margin: 12px 0 0 0;
  font-size: 14px;
  font-weight: 400;
}

.yb-senpai-detail__voices {
  display: grid;
  gap: 64px;
}

.yb-senpai-detail-voice {
  padding: 0 24px;
}

.yb-senpai-detail-voice h2,
.yb-senpai-detail-voice h3,
.yb-senpai-detail-voice p,
.yb-senpai-detail-voice figure {
  margin: 0;
}

.yb-senpai-detail-voice h2,
.yb-senpai-detail__gallery h2,
.yb-senpai-detail__course h2,
.yb-senpai-detail__photographers h2,
.yb-senpai-detail__related h2 {
  color: var(--senpai-color);
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-senpai-detail__photographers h2 {
  font-weight: 500;
  line-height: 1.2;
}

.yb-senpai-detail__related h2 {
  margin: 0;
  color: var(--yb-black);
  font-weight: 500;
  line-height: 1;
}

.yb-senpai-detail-voice h2,
.yb-senpai-detail__course h2 {
  text-decoration: underline wavy var(--senpai-color) 1px;
  text-underline-offset: 6px;
}

.yb-senpai-detail-voice h3 {
  position: relative;
  margin-top: 16px;
  padding-left: 40px;
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-senpai-detail-voice h3::before {
  content: "";
  position: absolute;
  top: 0.85em;
  left: 0;
  width: 28px;
  height: 1px;
  background: var(--senpai-color);
  transform: translateY(-50%);
}

.yb-senpai-detail-voice p {
  margin-top: 8px;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.85;
}

.yb-senpai-detail-voice .small {
  font-size: 12px;
}

.yb-senpai-detail-voice b {
  color: var(--senpai-color);
  font-weight: 500;
}

.yb-senpai-detail__course-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 60px;
  margin-top: 24px;
  padding: 10px 32px;
  border: 1px solid var(--yb-black);
  border-radius: 30px;
  background: var(--senpai-label-color, var(--senpai-tint));
  color: var(--yb-black);
  font-size: 20px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-senpai-detail__course-link::after {
  position: static;
  width: 16px;
  height: 16px;
  margin-left: 20px;
  flex: 0 0 auto;
  background: var(--yb-black);
}

.yb-senpai-detail-voice figure {
  margin-top: 40px;
  margin-bottom: 48px;
  text-align: center;
}

.yb-senpai-detail-voice img {
  width: min(100%, 480px);
  object-fit: contain;
}

.yb-senpai-detail__gallery,
.yb-senpai-detail__course,
.yb-senpai-detail__photographers,
.yb-senpai-detail__related {
  margin-top: 72px;
}

.yb-senpai-detail__gallery > div {
  display: grid;
  gap: 20px;
  margin-top: 24px;
}

.yb-senpai-detail__gallery figure,
.yb-senpai-detail__course figure {
  margin: 40px 0 0 0;
}

.yb-senpai-detail__gallery img,
.yb-senpai-detail__course img {
  width: 100%;
}

.yb-senpai-detail__gallery figcaption {
  margin-top: 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
}

.yb-senpai-detail__course figure {
  overflow: hidden;
  border: 1px solid var(--yb-black);
  border-radius: 46px;
  background: var(--yb-white);
}

.yb-senpai-detail__course {
  width: 552px;
  margin-right: auto;
  margin-left: auto;
}

.yb-senpai-detail__photographers {
  position: relative;
  width: 552px;
  margin-right: auto;
  margin-left: auto;
  padding: 48px 24px 24px;
  border: 1px solid var(--yb-black);
  border-radius: 48px;
  background: var(--senpai-soft, #f5e6e6);
}

.yb-senpai-detail__photographers h2 {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 293px;
  min-height: 48px;
  margin: 0;
  padding: 0 36px;
  border: 1px solid var(--yb-white);
  border-radius: 24px;
  background: var(--senpai-line, #7dd2cd);
  color: var(--yb-white);
  font-size: 21px;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  line-height: 1.1;
  letter-spacing: 0;
  text-align: center;
  transform: translateY(-50%);
}

.yb-senpai-detail__photographers-intro {
  width: 488px;
  margin: 0 auto;
  padding-left: 16px;
  color: #131313;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.05em;
}

.yb-senpai-detail__photographers ul {
  display: grid;
  gap: 4px;
  width: 488px;
  margin: 10px auto 0;
  padding: 0;
  list-style: none;
}

.yb-senpai-detail__photographers-item {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 24px;
  align-items: center;
  min-height: 128px;
  padding: 16px 20px;
  border-radius: 16px;
}

.yb-senpai-detail__photographers-photo {
  display: block;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--yb-white);
  box-shadow: 0 0 0 3.2px var(--yb-white), 0 0 0 4px var(--yb-black);
  object-fit: cover;
}

.yb-senpai-detail__photographers-body {
  display: grid;
  gap: 12px;
}

.yb-senpai-detail__photographers-name-row {
  display: flex;
  align-items: flex-end;
  gap: 12px;
}

.yb-senpai-detail__photographers .name {
  margin: 0;
  color: var(--senpai-color);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-senpai-detail__photographers .en {
  margin: 0;
  color: var(--senpai-color);
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-senpai-detail__photographers-profile {
  margin: 0;
  color: var(--senpai-color);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-senpai-detail__related {
  margin-right: -48px;
  margin-left: -48px;
  margin-top: 120px;
  padding-bottom: 40px;
  overflow: visible;
}

.yb-senpai-detail__related-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 48px;
}

.yb-senpai-detail__related-count {
  margin: 0;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 22px;
  font-weight: 500;
  line-height: 1;
}
.yb-senpai-detail__related-count span {
  font-weight: 100;
}

.yb-senpai-detail__related-carousel {
  position: relative;
  margin-top: 32px;
}

.yb-senpai-detail__related-carousel > ul[data-yb-related-track] {
  display: flex;
  gap: 24px;
  margin: 0;
  padding: 0 0 0 48px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  list-style: none;
  scroll-snap-type: none;
  scroll-padding-left: 48px;
  scroll-padding-right: 48px;
  scrollbar-width: none;
  cursor: grab;
  touch-action: pan-x pan-y;
}

.yb-senpai-detail__related-carousel > ul[data-yb-related-track]::after {
  content: "";
  flex: 0 0 48px;
}

.yb-senpai-detail__related-carousel > ul[data-yb-related-track]::-webkit-scrollbar {
  display: none;
}

.yb-senpai-detail__related-carousel > ul[data-yb-related-track].is-dragging {
  cursor: grabbing;
  user-select: none;
  scroll-behavior: auto;
}

.yb-senpai-detail__related-carousel > ul[data-yb-related-track].is-inertia {
  scroll-behavior: auto;
}

.yb-senpai-detail__related-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  display: grid;
  width: 64px;
  height: 64px;
  border: 1px solid var(--yb-black);
  border-radius: 50%;
  background: var(--yb-white);
  cursor: pointer;
  place-items: center;
}

.yb-senpai-detail__related-arrow::before {
  content: "";
  width: 16px;
  height: 16px;
  background: var(--yb-black);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-senpai-detail__related-arrow--prev {
  left: 16px;
}

.yb-senpai-detail__related-arrow--prev::before {
  transform: rotate(180deg);
}

.yb-senpai-detail__related-arrow--next {
  right: 16px;
}

.yb-senpai-detail__related .yb-senpai-index-card {
  flex: 0 0 280px;
  min-height: 440px;
  scroll-snap-align: start;
}

.yb-senpai-detail__related .yb-senpai-index-card a {
  height: 452px;
}

.yb-senpai-detail__related .yb-senpai-index-card__message {
  margin-top: 0;
  font-size: 22.4px;
}

.yb-senpai-detail__related .yb-senpai-index-card__more {
  display: none;
}

.yb-senpai-index--feature .yb-senpai-index__inner {
  min-height: max(100svh, 960px);
}

.yb-senpai-index-card--feature .yb-senpai-index-card__name {
  display: grid;
  align-items: center;
  justify-items: center;
  gap: 3px;
  min-height: 42px;
  line-height: 1.25;
  white-space: normal;
}

.yb-feature-interview-card__name-line {
  display: block;
}

.yb-feature-interview-card__meta {
  display: grid;
  gap: 3px;
  width: 220px;
  margin: 8px auto 0;
  color: #131313;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.45;
  text-align: center;
}

.yb-feature-interview-card__meta span {
  display: block;
  overflow-wrap: anywhere;
}

.yb-senpai-index-card--feature .yb-senpai-index-card__message {
  min-height: 128px;
  margin-top: 10px;
  font-size: 23px;
  line-height: 1.45;
}

.yb-senpai-index-card--teacher {
  --senpai-color: #4694d1;
  --senpai-tint: #9bcdeb;
}

.yb-senpai-index-card--teacher .yb-senpai-index-card__message {
  font-size: 22px;
}

.yb-senpai-detail--career-design {
  --senpai-color: #4694d1;
  --senpai-tint: #9bcdeb;
}

.yb-career-design-detail__subtitle {
  margin-top: 12px;
  color: #474b4e;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-senpai-detail-voice__section-title {
  margin: 64px 0 32px;
  color: #2f3336;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-career-design-related-list {
  display: grid;
  gap: 24px;
  margin: 0;
  padding: 24px 48px 0 48px;
  list-style: none;
}

.yb-career-design-related-list .yb-senpai-index-card {
  width: 480px;
  max-width: 100%;
}

.yb-senpai-detail--feature .yb-senpai-detail__hero {
  padding-bottom: 64px;
}

.yb-feature-interview-empty {
  width: 480px;
  margin: 240px 0 160px 96px;
  color: #474b4e;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-feature-interview-profile-list {
  display: grid;
  gap: 18px;
  margin-top: 72px;
}

.yb-feature-interview-profile-list .yb-senpai-detail__profile {
  margin-top: 0;
}

.yb-feature-interview-profile {
  min-height: 136px;
}

.yb-feature-interview-profile--teacher {
  overflow: hidden;
}

.yb-feature-interview-profile--teacher .yb-senpai-detail__profile p {
  color: #ffffff;
}

.yb-feature-interview-profile .yb-senpai-detail__profile-school {
  line-height: 1.55;
}

.yb-senpai-detail--teacher .yb-senpai-detail__content {
  background-color: #d9edf7;
  background-image: none;
}

.yb-senpai-detail--teacher .yb-senpai-detail__profile {
  background: #4694d1;
}

.yb-senpai-detail__related .yb-senpai-index-card--feature .yb-senpai-index-card__message {
  min-height: 92px;
  font-size: 19px;
}

.yb-senpai-detail__related .yb-feature-interview-card__meta {
  display: none;
}

.yb-campus-map__fixed-bg .yb-fixed-bg__layer {
  background-position: center center;
}

.yb-campus-map__lead {
  width: 626px;
  margin-top: 16px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.025em;
  line-height: 1.7;
}

.yb-campus-map__section {
  gap: 32px;
}

.yb-campus-map__section-title {
  font-size: 22px;
  letter-spacing: 0.1em;
}

.yb-campus-map__section-title::before {
  height: auto;
}

.yb-campus-map__map .yb-campus-map__section-title {
  font-size: 24px;
  letter-spacing: 0.05em;
}

.yb-campus-map__map-body {
  display: grid;
  gap: 24px;
}

.yb-campus-map__map-image {
  width: 624px;
  margin: 0;
}

.yb-campus-map__map-image img {
  display: block;
  width: 100%;
  aspect-ratio: 624/625;
  object-fit: cover;
}

.yb-campus-map__map-body p,
.yb-campus-map__section-heading p,
.yb-campus-map__virtual-heading p {
  margin: 0;
  color: #474b4e;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-campus-map__map-body p,
.yb-campus-map__section-heading p {
  padding-left: 2px;
}

.yb-campus-map__gallery-section {
  gap: 24px;
}

.yb-campus-map__section-heading {
  display: grid;
  gap: 16px;
}

.yb-campus-map-card .yb-index-card__text {
  gap: 12px;
}

.yb-campus-map-card .yb-index-card__description {
  font-feature-settings: "palt" 1;
}

.yb-campus-map__virtual {
  display: grid;
  gap: 24px;
  padding: 0 var(--yb-pad);
}

.yb-campus-map__virtual-heading {
  display: grid;
  gap: 10px;
  width: 528px;
}

.yb-campus-map__virtual-heading h2 {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-campus-map__virtual-heading p {
  padding-left: 2px;
}

.yb-campus-map__virtual-frame {
  width: 624px;
  overflow: hidden;
  background: #dfe1e0;
}

.yb-campus-map__virtual-frame iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1040/585;
  border: 0;
}

.yb-teacher-list {
  --yb-course-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-course-bg-left-h: calc(100vh - var(--yb-course-side-top));
  --yb-course-bg-stage-w: max(var(--yb-shell), var(--yb-course-bg-left-w), calc(var(--yb-course-bg-left-h) * 720 / 811));
  --yb-course-bg-stage-inset: calc(var(--yb-course-bg-stage-w) * 36 / 720);
  position: relative;
  padding: 36px 0 0;
  background: transparent;
}

.yb-teacher-list::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-course-side-top));
  aspect-ratio: auto;
  background: url("../img/about/teacher_list/right-img.webp") left top/var(--yb-course-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-teacher-list::before {
  display: none;
}

.yb-teacher-list .yb-course-detail__left-bg-layer--outer {
  background-image: url("../img/about/teacher_list/bg-left-outer.webp");
}

.yb-teacher-list .yb-course-detail__left-bg-layer--inner {
  background-image: url("../img/about/teacher_list/bg-left-inner.webp");
}

.yb-teacher-list .yb-course-detail__left-bg-layer--front {
  background-image: url("../img/about/teacher_list/bg-left-front.webp");
}

.yb-teacher-list:not(:has(.yb-course-detail__left-bg))::before {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-course-side-top);
  right: min(100vw, var(--yb-shell));
  display: block;
  width: var(--yb-course-bg-left-w);
  height: var(--yb-course-bg-left-h);
  box-sizing: border-box;
  padding: 36px;
  background-image: url("../img/about/teacher_list/bg-left-front.webp"), url("../img/about/teacher_list/bg-left-inner.webp"), url("../img/about/teacher_list/bg-left-outer.webp");
  background-position: right top, right top, right top;
  background-size: cover, cover, cover;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-origin: border-box, content-box, border-box;
  background-clip: border-box, content-box, border-box;
  pointer-events: none;
}

.yb-teacher-list__inner {
  position: relative;
  z-index: 1;
  gap: 64px;
  margin: 0 auto 96px;
  padding: 48px 0;
  width: 624px;
  background: var(--yb-white);
}

.yb-teacher-list__anchor {
  margin: 0 48px;
}

.yb-page-index {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid var(--yb-line);
}

.yb-page-index__heading {
  width: 100%;
  padding-bottom: 4px;
}

.yb-page-index__heading p {
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 0;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.yb-page-index__heading p::after {
  content: "";
  display: block;
  height: 1px;
  flex: 1 1 auto;
  background: var(--yb-line);
}

.yb-page-index__links {
  display: grid;
  gap: 0;
}

.yb-page-index__link {
  --yb-page-index-icon-color: currentColor;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 2px 24px 2px;
  border-bottom: 1px dashed #33b3ed;
  color: var(--yb-black);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.025em;
  line-height: 1.6;
  transition: color 0.18s ease;
}

.yb-page-index__link:last-child {
  border-bottom: 0;
}

.yb-page-index__link::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--yb-blue);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.28s ease;
}

.yb-page-index__link::after {
  content: "";
  display: block;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  background-color: var(--yb-page-index-icon-color, currentColor);
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 16px auto;
  -webkit-mask-image: url("../img/common/arrow-black.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 16px auto;
  transform: rotate(90deg);
}

.yb-page-index__link:hover,
.yb-page-index__link:focus-visible {
  --yb-page-index-icon-color: var(--yb-blue);
}

.yb-page-index__link:hover::before,
.yb-page-index__link:focus-visible::before {
  transform: scaleX(1);
}

.yb-teacher-list__content {
  display: grid;
  gap: 96px;
}

.yb-teacher-list__section {
  display: grid;
  gap: 24px;
  padding: 0 48px;
}

.yb-teacher-list__section--role {
  gap: 24px;
}

.yb-teacher-list__section-title {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.yb-teacher-list__table {
  margin-top: 24px;
}

.yb-teacher-list__course-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 304px;
  min-height: 60px;
  margin: 24px auto 0;
  padding: 10px 32px;
  border: 1px solid var(--teacher-list-color);
  border-radius: 999px;
  background-color: transparent;
  color: var(--teacher-list-color);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.yb-teacher-list__course-button:hover,
.yb-teacher-list__course-button:focus-visible {
  border-color: var(--teacher-list-color);
  background-color: var(--teacher-list-color);
  color: var(--yb-white);
}

.yb-teacher-list__course-button::after {
  content: "";
  display: inline-block;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("../img/common/arrow-black.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.yb-teacher-detail {
  background: #f4f4f4;
}

.yb-teacher-detail__visual {
  position: relative;
  background: #dfe1e0;
}

.yb-teacher-detail__visual-sticky {
  position: fixed;
  top: var(--yb-fixed-bg-top);
  left: 0;
  right: var(--yb-shell);
  width: auto;
  height: calc(100vh - var(--yb-fixed-bg-top));
  overflow: hidden;
  transition: top 0.28s ease, height 0.28s ease;
}

.yb-teacher-detail__visual-sticky img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.yb-teacher-detail__content {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
}

.yb-teacher-detail__name-block {
  display: grid;
  gap: 48px;
  padding: 40px 46px 48px;
  background: var(--teacher-course-tint);
}

.yb-teacher-detail__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 28px;
  color: #6b7175;
  font-size: 9px;
  font-weight: 500;
  line-height: 1;
}

.yb-teacher-detail__back::before {
  content: "";
  width: 19.2px;
  height: 19.2px;
  background: currentColor;
  mask-image: url("../img/common/arrow-back.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-image: url("../img/common/arrow-back.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.yb-teacher-detail__name-wrap {
  display: grid;
  gap: 16px;
}

.yb-teacher-detail__name-wrap h1 {
  display: flex;
  align-items: baseline;
  column-gap: 16px;
  row-gap: 0;
  flex-wrap: nowrap;
  margin: 0;
  color: var(--yb-black);
  font-size: 36px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-teacher-detail__name-wrap h1 span {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-teacher-detail__meta {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
}

.yb-teacher-detail__tag,
.yb-teacher-detail__position {
  margin: 0;
}

.yb-teacher-detail__tags {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.yb-teacher-detail__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 6px 12px;
  border-radius: 4px;
  background: var(--teacher-course-color);
  color: var(--teacher-course-tint);
  font-size: 12px;
  line-height: 1;
}

.yb-teacher-detail__position {
  color: #474b4e;
  font-size: 16px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-teacher-detail__career,
.yb-teacher-detail__works,
.yb-teacher-detail__book {
  padding: 48px;
}

.yb-teacher-detail__career h2,
.yb-teacher-detail__works h2,
.yb-teacher-detail__book h2 {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-teacher-detail__career ul {
  display: grid;
  gap: 12px;
  margin: 32px 0 0;
  padding: 0 0 8px 28px;
  list-style: none;
  position: relative;
}
.yb-teacher-detail__career ul::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 0;
  width: 1px;
  height: 100%;
  background: var(--teacher-course-color);
}

.yb-teacher-detail__career li {
  display: grid;
  grid-template-columns: 34px 8px minmax(0, 1fr) 16px;
  gap: 8px;
  align-items: start;
}
.yb-teacher-detail__career li.is-text-only .text {
  grid-column: 1/-1;
}
.yb-teacher-detail__career li.is-year-range .sep,
.yb-teacher-detail__career li.is-year-range .text {
  align-self: center;
}

.yb-teacher-detail__career li .year {
  color: #111827;
  font-family: var(--yb-font-en);
  font-size: 14px;
  line-height: 1.5;
  white-space: nowrap;
}

.yb-teacher-detail__career li .year--range {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.yb-teacher-detail__career li .year--range span {
  display: block;
}

.yb-teacher-detail__career li .year--range .year-range-sep {
  width: 1px;
  height: 6px;
  margin: -2px 0;
  background: #111827;
}

.yb-teacher-detail__career li .sep {
  position: relative;
  width: 8px;
  min-height: 21px;
}

.yb-teacher-detail__career li .sep::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 8px;
  height: 1px;
  background: var(--teacher-course-color);
  transform: translateY(-50%);
}

.yb-teacher-detail__career li .text {
  grid-column: 3/-1;
  color: #474b4e;
  font-size: 14px;
  line-height: 1.5;
  white-space: pre-line;
}

.yb-teacher-detail__career li .text a {
  color: var(--yb-blue);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
}

.yb-teacher-detail__empty {
  margin: 24px 0 0;
  color: #6b7175;
  font-size: 14px;
}

.yb-teacher-detail__works ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 64px 16px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.yb-teacher-detail__works li {
  margin: 0;
}

.yb-teacher-detail__works figure {
  height: 202px;
  margin: 0;
  overflow: hidden;
  background: #dfe1e0;
}

.yb-teacher-detail__works figure img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yb-teacher-detail__work-caption {
  display: grid;
  gap: 6px;
  margin-top: 30px;
}

.yb-teacher-detail__work-caption p {
  margin: 0;
}

.yb-teacher-detail__work-caption .title {
  color: var(--yb-black);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.5;
}

.yb-teacher-detail__work-caption .caption,
.yb-teacher-detail__work-caption .year {
  color: #70777c;
  font-size: 12px;
  line-height: 1.5;
}

.yb-teacher-detail__book {
  border-top: 1px solid var(--yb-border);
}

.yb-teacher-detail__book div {
  margin-top: 24px;
  color: #474b4e;
  font-size: 14px;
  line-height: 1.9;
}

.yb-teacher-detail__lower-nav {
  margin-top: 48px;
  border-top: 1px solid var(--yb-border);
  background: var(--yb-white);
}

.yb-teacher-detail__lower-nav .yb-lower-nav__back {
  border-bottom-color: var(--yb-border);
  background: #dfe1e0;
}

.yb-lower-nav--breadcrumb-only .yb-lower-nav__meta {
  border-top: 0;
}

.yb-value-fixed-bg {
  --yb-value-photo-width: 624px;
  --yb-value-photo-height: 732px;
  --yb-value-photo-left: calc((100vw - var(--yb-shell) - var(--yb-value-photo-width)) / 2);
  --yb-value-photo-top: calc((100% - var(--yb-value-photo-height)) / 2);
  --yb-value-text-width: 294px;
  --yb-value-text-height: 130px;
  top: var(--yb-value-bg-top);
  width: 100vw;
  height: calc(100vh - var(--yb-value-bg-top));
  overflow: hidden;
  transition: none;
}
@media (max-width: 1440px) {
  .yb-value-fixed-bg {
    width: 1440px;
    right: 0;
    left: auto;
    background-position: right top;
    background-size: 1440px;
  }
}

.yb-value-fixed-bg .yb-fixed-bg__layer {
  background-size: calc(100% + 100% - 720px) 100%;
  background-position: calc(50% - (100% - (100% - 720px) / 2)) top;
}

.yb-value-fixed-bg__photo {
  position: absolute;
  left: var(--yb-value-photo-left);
  top: 50%;
  transform: translateY(-50%);
  display: block;
  width: calc(100% - var(--yb-shell) - 96px);
  max-width: var(--yb-value-photo-width);
  aspect-ratio: 624/732;
  object-fit: cover;
}

.yb-value-fixed-bg__text {
  position: absolute;
  left: calc(var(--yb-value-photo-left) + var(--yb-value-photo-width) - var(--yb-value-text-width) + 19px);
  top: calc(var(--yb-value-photo-top) + var(--yb-value-photo-height) - var(--yb-value-text-height) + 45px);
  display: block;
  width: var(--yb-value-text-width);
  height: var(--yb-value-text-height);
  mix-blend-mode: difference;
  transform: none;
}

.yb-value-fixed-bg__text--index {
  left: 0;
  top: calc(var(--yb-value-bg-top) + (100vh - var(--yb-value-bg-top) - 780px) / 2);
  z-index: 3;
  width: 146px;
  height: 780px;
  mix-blend-mode: normal;
  transform: none;
}

.yb-value-page {
  position: relative;
  z-index: 1;
  background: transparent;
}

.yb-value-page--index {
  background: var(--yb-white);
}

.yb-value-page__inner {
  gap: 0;
  padding: 40px 48px 0 48px;
}

.yb-value-heading {
  padding-right: 48px;
  padding-left: 48px;
}

.yb-value-heading__description {
  color: #474b4e;
  line-height: 1.7;
}

.yb-value-heading__description p + p {
  margin-top: 0;
}

.yb-value-heading--detail {
  padding: 0;
}

.yb-value-heading--detail h1 {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.yb-value-heading--detail h1 span {
  display: block;
}

.yb-value-heading--detail > p {
  color: var(--yb-black);
  font-size: 13px;
}

.yb-value-panel {
  width: 624px;
  margin: 0 auto;
  padding: 48px 48px 16px;
  background: var(--yb-white);
}

.yb-value-content {
  display: grid;
  gap: 64px;
  width: 624px;
  margin: 0 auto;
  padding: 48px 0 16px;
  background: var(--yb-white);
}

.yb-value-section {
  padding-right: 48px;
  padding-left: 48px;
}

.yb-value-section--links {
  padding-top: 32px;
}

.yb-value-block-title {
  color: var(--yb-blue);
  font-size: 22px;
  letter-spacing: 0.05em;
}

.yb-value-link-list {
  display: grid;
  gap: 48px;
  margin-top: 32px;
}

.yb-value-link-item a {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

.yb-value-link-item__num {
  width: 100px;
  height: auto;
}

.yb-value-link-item__body {
  display: grid;
  gap: 16px;
  min-height: 188px;
  padding-top: 4px;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--yb-line);
}

.yb-value-link-item:last-child .yb-value-link-item__body {
  border-bottom: 0;
}

.yb-value-link-item__title {
  display: grid;
  gap: 8px;
}

.yb-value-link-item__title h3,
.yb-value-link-item__title p,
.yb-value-link-item__description p {
  margin: 0;
}

.yb-value-link-item__title h3 {
  color: var(--yb-blue);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-value-link-item__title p {
  padding-left: 2px;
  font-family: var(--yb-font-en);
  font-size: 12px;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.yb-value-link-item__description {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-value-more-button {
  font-family: var(--yb-font-en);
  font-size: 16px;
  letter-spacing: 0;
}

.yb-value-voice-card .yb-value-more-button::after {
  content: "→";
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  background: none;
  font-size: 16px;
  line-height: 1;
  mask-image: none;
}

.yb-value-section--interview {
  margin-top: 32px;
  padding: 48px;
  background: var(--yb-blue-05);
}

.yb-value-interview-head {
  display: flex;
  align-items: flex-end;
  gap: 16px;
}

.yb-value-interview-head img {
  width: 195px;
  height: auto;
}

.yb-value-interview-head h2 {
  margin: 0;
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.067em;
  line-height: 1;
}

.yb-value-interview-head h2 span {
  font-size: 14px;
  font-weight: 400;
}

.yb-value-voice-list {
  display: grid;
  gap: 48px;
}

.yb-value-voice-card {
  --yb-value-voice-bottom-line: 456px;
  position: relative;
  width: 576px;
  padding: 16px;
}

.yb-value-voice-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 32px;
  border-top: 1px solid #80d0f4;
  pointer-events: none;
}

.yb-value-voice-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--yb-value-voice-bottom-line);
  border-bottom: 1px solid #80d0f4;
  pointer-events: none;
}

.yb-value-voice-card:nth-child(2) {
  --yb-value-voice-bottom-line: 468px;
}

.yb-value-voice-card:nth-child(3) {
  --yb-value-voice-bottom-line: 480px;
}

.yb-value-voice-card a {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 164px minmax(0, 1fr);
  gap: 32px;
  min-height: 204px;
  padding: 24px;
  border-radius: 8px;
  background: var(--yb-white);
}

.yb-value-voice-card a::before {
  content: "";
  position: absolute;
  top: 0;
  right: -16px;
  bottom: 0;
  border-right: 1px solid #80d0f4;
  pointer-events: none;
}

.yb-value-voice-card__side {
  position: absolute;
  left: 16px;
  top: 0;
  z-index: 2;
  display: flex;
  width: 220px;
  height: 16px;
  align-items: flex-end;
  gap: 8px;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 0.5;
  text-transform: uppercase;
  transform: rotate(90deg);
  transform-origin: left top;
  white-space: nowrap;
}

.yb-value-voice-card__side::after {
  content: "";
  display: block;
  height: 1px;
  flex: 1 1 auto;
  background: #80d0f4;
}

.yb-value-voice-card__caption {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  color: var(--yb-blue);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.1;
  pointer-events: none;
  white-space: nowrap;
}

.yb-value-voice-card__image {
  width: 164px;
  height: 164px;
  margin: 0;
}

.yb-value-voice-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yb-value-voice-card__body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 0 8px;
}

.yb-value-voice-card__body h3,
.yb-value-voice-card__description p {
  margin: 0;
}

.yb-value-voice-card__body h3 {
  width: fit-content;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration: underline wavy var(--yb-blue);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

.yb-value-voice-card__description {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-value-cycle {
  display: grid;
  gap: 32px;
  padding: 0 48px;
}

.yb-value-cycle__chart {
  display: grid;
  gap: 24px;
  padding: 32px;
  background: var(--yb-blue-05);
}

.yb-value-cycle__chart h3 {
  margin: 0;
  color: var(--yb-blue);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
}

.yb-value-cycle__chart figure {
  width: 388px;
  margin: 0 auto;
}

.yb-value-cycle-list {
  display: grid;
  gap: 16px;
}

.yb-value-cycle-card {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 24px;
  border: 1px solid var(--yb-blue);
  background: var(--yb-white);
}

.yb-value-cycle-card img {
  grid-row: 1/span 2;
  width: 104px;
}

.yb-value-cycle-card h3,
.yb-value-cycle-card p {
  margin: 0;
}

.yb-value-cycle-card h3 {
  grid-column: 2;
  color: var(--yb-blue);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
}

.yb-value-cycle-card p {
  grid-column: 2;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.025em;
  line-height: 1.7;
}

.yb-value-goals {
  display: grid;
  gap: 24px;
  padding: 0 48px 32px;
}

.yb-value-goal-list {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: value-goal;
}

.yb-value-goal-list li {
  position: relative;
  min-height: 64px;
  padding: 20px 24px 20px 72px;
  background: var(--yb-blue-05);
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.35;
  counter-increment: value-goal;
}

.yb-value-goal-list li::before {
  content: counter(value-goal, decimal-leading-zero);
  position: absolute;
  left: 24px;
  top: 50%;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  transform: translateY(-50%);
}

.yb-value-next {
  padding: 48px 60px 96px;
  background: #e6f6fd;
}

.yb-value-next__link {
  position: relative;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) 48px;
  grid-template-areas: "label num title arrow" "label num en arrow";
  column-gap: 4px;
  align-items: center;
  width: 480px;
  min-height: 120px;
  padding: 0 36px;
  border: 1px solid var(--yb-blue);
  border-radius: 60px;
  background: var(--yb-white);
}

.yb-value-next__label {
  grid-area: label;
  font-family: var(--yb-font-en);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.yb-value-next__num {
  grid-area: num;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 62px;
  font-weight: 600;
  line-height: 0.78;
  margin-right: 12px;
}

.yb-value-next__title {
  grid-area: title;
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}

.yb-value-next__title span {
  font-size: 16px;
  font-weight: 400;
}

.yb-value-next__en {
  grid-area: en;
  margin-top: 8px;
  color: #474b4e;
  font-family: var(--yb-font-en);
  font-size: 12px;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.yb-value-next__link::after {
  content: "";
  grid-area: arrow;
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--yb-blue) url("../img/common/arrow-white.svg") center/16px 16px no-repeat;
}

#value-step-title {
  line-height: 1.6;
}

.yb-value-step-list {
  display: grid;
  gap: 64px;
  width: 624px;
  margin: 0 auto;
  padding: 48px 48px 16px;
  background: var(--yb-white);
}

.yb-value-step {
  display: grid;
  gap: 24px;
}

.yb-value-step__head {
  display: flex;
  align-items: flex-end;
  gap: 16px;
}

.yb-value-step__num {
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 72px;
  font-weight: 500;
  line-height: 0.78;
}

.yb-value-step__head h2 {
  margin: 0 0 6px;
  color: var(--yb-blue);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-value-step__main {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 24px;
}

.yb-value-step__label {
  margin: 0;
  color: var(--yb-blue);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.3;
  writing-mode: vertical-rl;
}

.yb-value-step__chart {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 368px;
  margin: 0;
  padding: 24px;
  background: var(--yb-blue-05);
}

.yb-value-step__chart img {
  display: block;
  max-height: 526px;
  object-fit: contain;
}

.yb-value-step__lottie {
  display: block;
  width: 100%;
  height: 100%;
}

.yb-value-step__lottie svg,
.yb-value-step__lottie-fallback {
  display: block;
  width: 100%;
  height: 100%;
}

.yb-value-step__lottie.is-loaded .yb-value-step__lottie-fallback {
  display: none;
}

.yb-value-step__text h3,
.yb-value-step__text p {
  margin: 0;
}

.yb-value-feature-list {
  display: grid;
  gap: 64px;
  padding: 0 48px;
}

.yb-value-feature-card a {
  display: grid;
}

.yb-value-feature-card__image {
  width: 100%;
  height: 220px;
  margin: 0;
  overflow: hidden;
}

.yb-value-feature-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-value-feature-card__body {
  display: grid;
  gap: 16px;
  padding: 24px;
  background: var(--yb-blue-05);
}

.yb-value-feature-card__body h2,
.yb-value-feature-card__body p {
  margin: 0;
}

.yb-value-feature-card__body h2 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-value-feature-card__body p {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-value-curriculum-section {
  display: grid;
  gap: 24px;
  padding: 24px 48px 16px;
  scroll-margin-top: calc(var(--yb-header) + 16px);
}

.yb-value-small-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 248px));
  gap: 48px 32px;
}

.yb-value-small-card a {
  display: grid;
  gap: 24px;
}

.yb-value-small-card__image {
  width: 100%;
  height: 186px;
  margin: 0;
  overflow: hidden;
  background: #f0f2f4;
}

.yb-value-small-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.yb-value-small-card__body {
  display: grid;
  gap: 16px;
  padding: 0 2px;
}

.yb-value-small-card__body h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-value-small-card__body h3::after {
  content: "";
  display: block;
  width: 17px;
  height: 16px;
  flex: 0 0 auto;
  background-color: var(--yb-black);
  -webkit-mask-image: url("../img/common/arrow-black.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: background-color 0.2s ease;
}

.yb-value-small-card a:is(:hover, :focus-visible) .yb-value-small-card__body h3::after {
  background-color: var(--yb-blue);
}

.yb-value-small-card__body p {
  margin: 0;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-value-fixed-bg--philosophy .yb-value-fixed-bg__photo {
  left: max(0px, 1440px - 100vw);
  top: 0;
  width: calc(100vw - var(--yb-shell));
  height: 100%;
  max-width: none;
  max-height: none;
  transform: none;
  object-position: center bottom;
}

.yb-value-page--philosophy,
.yb-value-page--step,
.yb-value-page--curriculum {
  --yb-feature-detail-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-feature-detail-bg-left-h: calc(100vh - var(--yb-value-bg-top));
  --yb-feature-detail-bg-stage-w: max(var(--yb-shell), var(--yb-feature-detail-bg-left-w), calc(var(--yb-feature-detail-bg-left-h) * 720 / 812));
  --yb-feature-detail-bg-stage-h: max(var(--yb-feature-detail-bg-left-h), calc(var(--yb-feature-detail-bg-stage-w) * 812 / 720));
  background: transparent;
}

.yb-value-page--philosophy::after,
.yb-value-page--step::after,
.yb-value-page--curriculum::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-value-bg-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-value-bg-top));
  background: url("../img/feature/bg/bg-right.webp") left top/var(--yb-feature-detail-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-value-page--philosophy .yb-value-page__inner,
.yb-value-page--philosophy .yb-lower-nav,
.yb-value-page--step .yb-value-page__inner,
.yb-value-page--step .yb-lower-nav,
.yb-value-page--curriculum .yb-value-page__inner,
.yb-value-page--curriculum .yb-lower-nav {
  position: relative;
  z-index: 1;
}

.yb-value-fixed-bg--step,
.yb-value-fixed-bg--curriculum {
  --yb-feature-detail-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-feature-detail-bg-left-h: calc(100vh - var(--yb-value-bg-top));
  --yb-feature-detail-bg-stage-w: max(var(--yb-shell), var(--yb-feature-detail-bg-left-w), calc(var(--yb-feature-detail-bg-left-h) * 720 / 812));
  --yb-feature-detail-bg-stage-h: max(var(--yb-feature-detail-bg-left-h), calc(var(--yb-feature-detail-bg-stage-w) * 812 / 720));
  background: transparent;
}

.yb-value-fixed-bg--step .yb-fixed-bg__layer,
.yb-value-fixed-bg--curriculum .yb-fixed-bg__layer {
  inset: auto;
  top: 0;
  right: min(100vw, var(--yb-shell));
  width: var(--yb-feature-detail-bg-stage-w);
  height: var(--yb-feature-detail-bg-stage-h);
  opacity: 1;
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

body:has(.yb-value-page--philosophy) .yb-footer-nav,
body:has(.yb-value-page--philosophy) .yb-footer-cta,
body:has(.yb-value-page--philosophy) .yb-footer,
body:has(.yb-value-page--step) .yb-footer-nav,
body:has(.yb-value-page--step) .yb-footer-cta,
body:has(.yb-value-page--step) .yb-footer,
body:has(.yb-value-page--curriculum) .yb-footer-nav,
body:has(.yb-value-page--curriculum) .yb-footer-cta,
body:has(.yb-value-page--curriculum) .yb-footer {
  z-index: 2;
}

.yb-value-page--index {
  --yb-feature-index-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-feature-index-bg-left-h: calc(100vh - var(--yb-value-bg-top));
  --yb-feature-index-bg-stage-w: max(var(--yb-shell), var(--yb-feature-index-bg-left-w), calc(var(--yb-feature-index-bg-left-h) * 720 / 812));
  --yb-feature-index-bg-stage-h: max(var(--yb-feature-index-bg-left-h), calc(var(--yb-feature-index-bg-stage-w) * 812 / 720));
  --yb-feature-index-bg-inset: calc(var(--yb-feature-index-bg-stage-w) * 24 / 720);
  background: transparent;
}

.yb-value-page--index::after {
  content: "";
  position: fixed;
  z-index: 0;
  top: var(--yb-value-bg-top);
  left: calc(100% - var(--yb-shell));
  width: var(--yb-shell);
  height: calc(100vh - var(--yb-value-bg-top));
  background: url("../img/feature/index/bg-right.webp") left top/var(--yb-feature-index-bg-stage-w) auto no-repeat;
  pointer-events: none;
}

.yb-value-fixed-bg--index {
  --yb-feature-index-bg-left-w: max(0px, calc(100vw - var(--yb-shell)));
  --yb-feature-index-bg-left-h: calc(100vh - var(--yb-value-bg-top));
  --yb-feature-index-bg-stage-w: max(var(--yb-shell), var(--yb-feature-index-bg-left-w), calc(var(--yb-feature-index-bg-left-h) * 720 / 812));
  --yb-feature-index-bg-stage-h: max(var(--yb-feature-index-bg-left-h), calc(var(--yb-feature-index-bg-stage-w) * 812 / 720));
  --yb-feature-index-bg-inset: calc(var(--yb-feature-index-bg-stage-w) * 24 / 720);
  left: auto;
  right: min(100vw, var(--yb-shell));
  width: var(--yb-feature-index-bg-left-w);
  height: var(--yb-feature-index-bg-left-h);
  background: transparent;
}

.yb-value-fixed-bg--index .yb-fixed-bg__layer {
  display: none;
}

.yb-value-fixed-bg__stage {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--yb-feature-index-bg-stage-w);
  height: var(--yb-feature-index-bg-stage-h);
}

.yb-value-fixed-bg__layer {
  position: absolute;
  background-position: right top;
  background-repeat: no-repeat;
  pointer-events: none;
}

.yb-value-fixed-bg__layer--outer,
.yb-value-fixed-bg__layer--front {
  inset: 0;
  background-size: 100% 100%;
}

.yb-value-fixed-bg__layer--outer {
  z-index: 0;
  background-image: url("../img/feature/index/bg-left-outer.webp");
}

.yb-value-fixed-bg__layer--inner {
  z-index: 1;
  top: 24px;
  right: 0;
  bottom: max(24px, var(--yb-feature-index-bg-stage-h) - var(--yb-feature-index-bg-left-h) + 24px);
  left: max(24px, var(--yb-feature-index-bg-stage-w) - var(--yb-feature-index-bg-left-w) + 24px);
  background-image: url("../img/feature/index/bg-left-inner.webp");
  background-position: right top calc(var(--yb-feature-index-bg-inset) - 24px);
  background-size: calc(var(--yb-feature-index-bg-stage-w) * 696 / 720) auto;
}

.yb-value-fixed-bg__layer--front {
  z-index: 2;
  background-image: url("../img/feature/index/bg-left-front.webp");
}

body:has(.yb-value-page--index) .yb-footer-nav,
body:has(.yb-value-page--index) .yb-footer-cta,
body:has(.yb-value-page--index) .yb-footer {
  z-index: 2;
}

.yb-value-page--index .yb-value-page__inner {
  position: relative;
  z-index: 1;
  width: 672px;
  margin: 24px auto 96px;
  padding: 0;
  background: var(--yb-white);
}

.yb-value-page--index .yb-value-heading {
  padding: 48px 46px 0;
}

.yb-value-page--index .yb-value-section--links {
  margin-top: 32px;
  padding: 24px 48px 0;
  gap: 0;
}

.yb-value-page--index .yb-value-link-list {
  margin-top: 28px;
}

.yb-value-page--index .yb-value-link-item a {
  grid-template-columns: 99px 400px;
  column-gap: 48px;
}

.yb-value-page--index .yb-value-link-item__num {
  width: 99px;
}

.yb-value-page--index .yb-value-link-item__body {
  min-height: 206px;
}

.yb-value-page--index .yb-value-section--interview {
  margin-top: 32px;
  padding: 48px;
  gap: 32px;
}

.yb-value-page--index .yb-value-voice-card {
  width: 576px;
  min-height: 236px;
}

.yb-value-page--index .yb-value-voice-card a {
  width: 544px;
  min-height: 204px;
  margin-left: 0;
  padding: 24px 24px 16px;
  grid-template-columns: 164px 320px;
  gap: 24px;
}

.yb-value-page--philosophy .yb-value-heading__description {
  letter-spacing: 0.05em;
}

.yb-value-page--philosophy .yb-value-content {
  gap: 48px;
  padding: 48px 0;
}

.yb-value-page--philosophy .yb-value-cycle {
  display: block;
  height: 725px;
  padding: 0 48px;
}

.yb-value-cycle__lead {
  margin-top: 14px;
}

.yb-value-cycle__lead p {
  margin: 0;
  font-size: 14px;
  line-height: 1;
}

.yb-value-page--philosophy .yb-value-cycle__chart {
  width: 528px;
  height: 480px;
  margin-top: 24px;
  padding: 0;
  place-items: start center;
}

.yb-value-page--philosophy .yb-value-cycle__chart figure {
  width: 388px;
  margin-top: 60px;
}

.yb-value-page--philosophy .yb-value-cycle-list {
  grid-template-columns: repeat(3, 160px);
  gap: 24px;
  width: 528px;
  height: 119px;
  margin-top: 24px;
}

.yb-value-page--philosophy .yb-value-cycle-card {
  display: block;
  width: 160px;
  padding: 0;
  border: 0;
  background: transparent;
}

.yb-value-page--philosophy .yb-value-cycle-card img {
  width: 160px;
}

.yb-value-page--philosophy .yb-value-cycle-card h3 {
  display: none;
}

.yb-value-page--philosophy .yb-value-cycle-card p {
  margin-top: 8px;
  color: var(--yb-blue);
  font-size: 13px;
  line-height: 1.5;
}

.yb-value-page--philosophy .yb-value-goals {
  display: block;
  height: 440px;
  padding: 0 48px;
}

.yb-value-page--philosophy .yb-value-goals .yb-section-lead {
  margin-top: 14px;
}

.yb-value-page--philosophy .yb-value-goal-list {
  gap: 8px;
  margin-top: 48px;
}

.yb-value-page--philosophy .yb-value-goal-list li {
  display: flex;
  flex-direction: column;
  height: 96px;
  min-height: 0;
  padding: 0 48px;
  align-items: center;
  justify-content: center;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 18px;
  line-height: 1.45;
  text-align: center;
}

.yb-value-page--philosophy .yb-value-goal-list li span {
  display: block;
}

.yb-value-page--philosophy .yb-value-goal-list li::before {
  content: none;
}

.yb-value-page--philosophy .yb-value-next,
.yb-value-page--step .yb-value-next {
  background: var(--yb-blue-05);
}

.yb-value-page--philosophy .yb-value-next__link,
.yb-value-page--step .yb-value-next__link {
  grid-template-rows: min-content min-content;
  row-gap: 10px;
  align-content: center;
  width: 480px;
  min-height: 124px;
  padding: 0 36px;
  border: 0;
  border-radius: 0;
  background: transparent url("../img/feature/vision/next-btn-frame.svg") center/100% 100% no-repeat;
}

.yb-value-page--philosophy .yb-value-next__num,
.yb-value-page--step .yb-value-next__num {
  display: block;
  width: 51px;
  height: 56px;
  object-fit: contain;
}

.yb-value-page--philosophy .yb-value-next__title,
.yb-value-page--step .yb-value-next__title {
  align-self: end;
}

.yb-value-page--philosophy .yb-value-next__en,
.yb-value-page--step .yb-value-next__en {
  align-self: start;
  margin-top: 0;
}

.yb-value-page--philosophy .yb-value-next__link::after,
.yb-value-page--step .yb-value-next__link::after {
  align-self: center;
}

.yb-value-page--detail .yb-value-next {
  width: 624px;
  height: 265px;
  margin: 0 auto;
  padding: 48px 60px 0;
}

.yb-value-page--detail .yb-value-next__link {
  width: 480px;
  min-height: 120px;
}

.yb-value-page--detail.yb-value-page--philosophy .yb-value-next__link,
.yb-value-page--detail.yb-value-page--step .yb-value-next__link {
  min-height: 124px;
}

.yb-value-page--step .yb-value-step-list {
  width: 624px;
  height: 3293px;
  margin: 0 auto;
  padding: 48px 0;
  gap: 0;
}

.yb-value-step {
  width: 624px;
  padding: 0 48px;
  align-content: start;
  gap: 16px;
}

.yb-value-step__head {
  height: 48px;
  align-items: center;
  gap: 24px;
}

.yb-value-step__num {
  display: flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 32px;
  line-height: 1;
}

.yb-value-step__head h2 {
  margin: 0;
  font-size: 32px;
  line-height: 1;
}

.yb-value-step__main {
  grid-template-columns: 48px 456px;
  column-gap: 24px;
  row-gap: 0;
  align-content: start;
}

.yb-value-step--01 .yb-value-step__main {
  height: 634px;
}

.yb-value-step--02 .yb-value-step__main {
  height: 794px;
}

.yb-value-step--03 .yb-value-step__main {
  height: 682px;
}

.yb-value-step--04 .yb-value-step__main {
  height: 639px;
}

.yb-value-step__label {
  display: block;
  width: 48px;
  height: 100%;
  margin: 0;
  max-width: none;
  object-fit: fill;
  grid-row: 1;
}

.yb-value-step__panel {
  display: flex;
  margin-bottom: 24px;
  width: 456px;
  flex-direction: column;
  background: var(--yb-blue-05);
  grid-column: 2;
}

.yb-value-step--04 .yb-value-step__panel {
  margin-bottom: 0;
}

.yb-value-step__chart {
  width: 456px;
  margin: 0;
  padding: 0;
}

.yb-value-step--01 .yb-value-step__chart {
  height: 420px;
}

.yb-value-step--02 .yb-value-step__chart {
  height: 580px;
}

.yb-value-step--03 .yb-value-step__chart {
  height: 468px;
}

.yb-value-step--04 .yb-value-step__chart {
  height: 471px;
}

.yb-value-step__chart img {
  width: auto;
  max-width: none;
  max-height: none;
}

.yb-value-step__lottie svg,
.yb-value-step__lottie-fallback {
  width: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
}

.yb-value-step--01 .yb-value-step__chart img {
  width: 318px;
  height: 368px;
}

.yb-value-step--02 .yb-value-step__chart img {
  width: 318px;
  height: 526px;
}

.yb-value-step--03 .yb-value-step__chart img {
  width: 370px;
  height: 420px;
}

.yb-value-step--04 .yb-value-step__chart img {
  width: 377px;
  height: 423px;
}

.yb-value-step__text {
  width: 424px;
  height: 142px;
  min-height: 0;
  margin: 16px auto 32px;
  padding: 24px 20px 24px 24px;
  border: 1px solid #e6f6fd;
  border-radius: 8px;
  background: var(--yb-white);
  color: var(--yb-blue);
}

.yb-value-step--04 .yb-value-step__text {
  height: 120px;
}

.yb-value-step__text h3 {
  color: var(--yb-blue);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

.yb-value-step__text p {
  margin-top: 12px;
  color: var(--yb-blue);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 1.6;
}

.yb-value-page--curriculum .yb-value-content {
  gap: 64px;
  padding: 48px 0 112px;
}

.yb-value-feature-list {
  gap: 64px;
  padding: 0;
}

.yb-value-feature-card {
  width: 624px;
}

.yb-value-feature-card__image,
.yb-value-feature-card__body {
  width: 528px;
  margin-left: 48px;
}

.yb-value-curriculum-section {
  display: block;
  height: 380px;
  padding: 24px 48px 0;
}

.yb-value-curriculum-section--multi-row {
  height: 720px;
}

.yb-value-small-card-grid {
  height: 292px;
  margin-top: 22px;
  gap: 0 32px;
}

.yb-value-curriculum-section--multi-row .yb-value-small-card-grid {
  height: 632px;
  gap: 48px 32px;
}

.yb-value-small-card {
  height: 292px;
}

.yb-value-small-card__body h3 {
  position: relative;
  display: block;
  padding-right: 32px;
  white-space: nowrap;
}

.yb-value-small-card__body h3::after {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.yb-language-en-top__fixed-bg {
  top: var(--yb-language-bg-top, var(--yb-fixed-bg-top));
  width: 100vw;
  height: calc(100svh - var(--yb-language-bg-top, var(--yb-fixed-bg-top)));
  overflow: hidden;
  background: transparent;
  transition: top 0.28s ease, height 0.28s ease;
}

.yb-language-common-bg__image {
  position: absolute;
  left: calc(100vw - 720px);
  top: 0;
  width: max(1440px, (100vw - 720px) * 2, (100svh - var(--yb-header)) * 2880 / 1624);
  height: 100%;
  transform: translateX(-50%);
  background-image: url("../img/common/bg-image.webp");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

.yb-language-common-bg__yokobi {
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 1;
  display: block;
  width: auto;
  max-width: none;
  height: min(96%, 780px);
  transform: translateY(-50%);
  pointer-events: none;
}

.yb-language-en-top {
  position: relative;
  z-index: 1;
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  background: transparent;
}

.yb-language-en-top__inner {
  padding: 24px 24px 0;
}

.yb-language-en-top__panel {
  padding: 48px 48px 96px;
  background: var(--yb-white);
}

.yb-language-en-top__heading h1,
.yb-language-en-top__heading p,
.yb-language-en-top__section-title,
.yb-language-en-top__small-title,
.yb-language-en-president p {
  margin: 0;
}

.yb-language-en-top__heading {
  display: grid;
  gap: 12px;
  padding-bottom: 16px;
}

.yb-language-en-top__heading h1 {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-transform: uppercase;
}

.yb-language-en-top__ja-name {
  color: var(--yb-blue);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-language-en-top__lead,
.yb-language-en-top__text {
  width: 576px;
  max-width: 100%;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

.yb-language-en-top__section {
  padding: 24px 0 16px;
}

.yb-language-en-top__section--strengths {
  margin-top: 32px;
}

.yb-language-en-top__section-title {
  display: flex;
  align-items: stretch;
  gap: 12px;
  color: var(--yb-black);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-transform: uppercase;
}

.yb-language-en-top__section-title::before {
  content: "";
  display: block;
  width: 4px;
  min-height: 1em;
  height: auto;
  flex: 0 0 auto;
  align-self: stretch;
  background: var(--yb-blue);
}

.yb-language-en-top__text {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}

.yb-language-en-top__text p {
  margin: 0;
}

.yb-language-en-top__small-title {
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.35;
  text-transform: uppercase;
}

.yb-language-en-president {
  display: grid;
  gap: 16px;
  margin-top: 8px;
  padding: 24px;
  border: 1px solid #80d0f4;
  border-radius: 8px;
  background: var(--yb-white);
}

.yb-language-en-president__summary {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  width: 344px;
  max-width: 100%;
}

.yb-language-en-president__image {
  width: 160px;
  height: 120px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--yb-border);
}

.yb-language-en-president__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 48% 50%;
}

.yb-language-en-president__profile {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding-top: 2px;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-language-en-president__profile .yb-language-en-president__name {
  margin-bottom: 8px;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.yb-language-en-president__bio p {
  margin: 0;
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.08em;
  line-height: 1.7;
}

.yb-language-en-top__section--menu {
  margin-top: 64px;
}

.yb-language-en-menu {
  margin-top: 24px;
}

.yb-language-en-menu-card__image {
  height: 204px;
}

.yb-language-en-menu-card__text {
  color: var(--color-ui-text-black, #131313);
  font-family: var(--yb-font-jp);
  font-size: 18px;
  font-style: normal;
  font-weight: 650;
  line-height: 100%;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.yb-language-static-page__heading {
  padding-bottom: 64px;
}

.yb-language-page__heading {
  display: grid;
  gap: 8px;
  padding-bottom: 48px;
}

.yb-language-page__heading h1,
.yb-language-page__heading p {
  margin: 0;
}

.yb-language-page__heading h1 {
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.yb-language-page__heading p {
  color: var(--yb-black);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-language-page__body {
  display: grid;
  gap: 64px;
  color: #2f3336;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.65;
}

.yb-language-page__body section {
  min-width: 0;
}

.yb-language-page__body > section {
  padding: 24px 0 16px;
}

.yb-language-page__body section section {
  margin-top: 32px;
}

.yb-language-page__body p,
.yb-language-page__body ol,
.yb-language-page__body ul,
.yb-language-page__body dl,
.yb-language-page__body figure {
  margin: 0;
}

.yb-language-page__body p + p {
  margin-top: 16px;
}

.yb-language-page__body p + .ol-01 {
  margin-top: 16px;
}

.yb-language-page__body .heading-02 {
  margin: 0 0 24px;
}

.yb-language-page__body .heading-02 h2 {
  display: flex;
  align-items: stretch;
  gap: 12px;
  margin: 0;
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-transform: uppercase;
}

.yb-language-page__body .heading-02 h2::before {
  content: "";
  display: block;
  width: 4px;
  min-height: 1em;
  height: auto;
  flex: 0 0 auto;
  align-self: stretch;
  background: var(--yb-blue);
}

.yb-language-page__body .heading-03 {
  margin: 0 0 16px;
}

.yb-language-page__body .heading-03 h3 {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.45;
  text-transform: uppercase;
}

.yb-language-page__body .heading-04 {
  margin: 0 0 12px;
}

.yb-language-page__body .heading-04 h4 {
  margin: 0;
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: 0.06em;
  line-height: 1.45;
  text-transform: uppercase;
}

.yb-language-page__body .table-02 {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #80d0f4;
}

.yb-language-page__body .table-02 th,
.yb-language-page__body .table-02 td {
  padding: 14px 16px;
  border: 1px solid #80d0f4;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
  text-align: left;
  vertical-align: middle;
}

.yb-language-page__body .table-02 th {
  width: 198px;
  border-color: #fff;
  border-left-color: #80d0f4;
  background: #33b3ed;
  color: var(--yb-white);
  font-weight: 500;
}

.yb-language-page__body .table-02 tr:first-child th {
  border-top-color: #80d0f4;
}

.yb-language-page__body .table-02 tr:last-child th {
  border-bottom-color: #80d0f4;
}

.yb-language-page__body .table-02 th + td {
  border-left-color: #fff;
}

.yb-language-page__body .yb-language-history-table th {
  width: 80px;
  padding-inline: 8px;
  text-align: center;
  white-space: nowrap;
}

.yb-language-page--about .yb-language-page__body > section:first-child .table-02 tr:nth-child(-n+2) {
  height: 72px;
}

.yb-language-page--about .yb-language-page__body > section:first-child .table-02 tr:nth-child(3) {
  height: 94px;
}

.yb-language-page__body .ol-01 {
  display: grid;
  gap: 0;
  color: #2f3336;
  line-height: 1.6;
  padding-left: 21px;
}

.yb-language-page__body .ol-01 li::marker {
  color: currentColor;
  font-weight: 400;
}

.yb-language-page__body .ul-01 {
  display: grid;
  gap: 6px;
  padding-left: 0;
  list-style: none;
}

.yb-language-page__body .ul-01 li {
  position: relative;
  padding-left: 16px;
}

.yb-language-page__body .ul-01 li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--yb-blue);
  transform: translateY(-50%);
}

.yb-language-page__body .mt-0 {
  margin-top: 0;
}

.yb-language-page__body .mt-40 {
  margin-top: 40px;
}

.yb-language-page__body .mt-60 {
  margin-top: 60px;
}

.yb-language-page__body .mt-80 {
  margin-top: 80px;
}

.yb-language-page__body .mb-20 {
  margin-bottom: 20px;
}

.yb-language-page__section {
  display: grid;
  gap: 32px;
}

.yb-language-page__plain-title {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.35;
  text-transform: uppercase;
}

.yb-language-page__section--liberal-arts {
  margin-top: 64px;
  color: #2f3336;
  font-size: 14px;
  letter-spacing: 0.02em;
  line-height: 1.65;
}

.yb-language-page__section--liberal-arts p {
  margin: 0;
}

.yb-language-curriculum {
  display: grid;
  gap: 56px;
}

.yb-language-curriculum__item {
  display: grid;
  gap: 16px;
}

.yb-language-curriculum__heading {
  display: flex;
  align-items: center;
  gap: 18px;
}

.yb-language-curriculum__number {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-family: var(--yb-font-en);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-language-curriculum__heading h3 {
  margin: 0;
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-transform: uppercase;
}

.yb-language-curriculum__content {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 24px;
}

.yb-language-curriculum__stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 320px;
  margin: 0;
  border: 1px solid var(--yb-blue);
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-align: center;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

.yb-language-curriculum__card {
  display: grid;
  gap: 24px;
  padding: 32px 28px;
  background: #e8f7fd;
}

.yb-language-curriculum__image {
  display: grid;
  min-height: 240px;
  margin: 0;
  place-items: center;
}

.yb-language-curriculum__image img {
  display: block;
  width: min(100%, 360px);
  height: auto;
}

.yb-language-curriculum__text {
  display: grid;
  gap: 10px;
  padding: 20px;
  border-radius: 6px;
  background: var(--yb-white);
  color: var(--yb-blue);
  font-size: 14px;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

.yb-language-curriculum__text h4,
.yb-language-curriculum__text p {
  margin: 0;
}

.yb-language-curriculum__text h4 {
  font-size: 16px;
  font-weight: 650;
  letter-spacing: 0.08em;
  line-height: 1.35;
}

.yb-language-access {
  display: grid;
  gap: 72px;
}

.yb-language-access__location,
.yb-language-access__station {
  display: grid;
  gap: 24px;
}

.yb-language-access__address {
  display: grid;
  gap: 10px;
  color: #2f3336;
  font-size: 16px;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-language-access__address h3,
.yb-language-access__address p,
.yb-language-access__station h3,
.yb-language-access__description,
.yb-language-access-route h3,
.yb-language-access-route p {
  margin: 0;
}

.yb-language-access__address h3,
.yb-language-access__station h3 {
  color: var(--yb-black);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-language-access__button {
  margin-top: 4px;
}

.yb-language-access__map {
  width: 100%;
  margin: 0;
  overflow: hidden;
  background: #e8f7fd;
}

.yb-language-access__map img {
  display: block;
  width: 100%;
  height: auto;
}

.yb-language-access__description {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-language-access-routes {
  display: grid;
  gap: 32px;
}

.yb-language-access-route {
  display: grid;
  gap: 10px;
  padding-left: 16px;
  border-left: 3px solid var(--yb-blue);
}

.yb-language-access-route h3 {
  color: var(--yb-blue);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.yb-language-access-route p {
  color: #474b4e;
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.7;
}

.yb-language-contact {
  display: grid;
  gap: 72px;
}

.yb-language-contact__section {
  display: grid;
  gap: 24px;
}

.yb-language-contact__section .yb-language-en-top__section-title {
  font-size: 22px;
  letter-spacing: 0.1em;
  line-height: 1.2;
}

.yb-language-page--access .yb-language-en-top__section-title {
  font-size: 22px;
  letter-spacing: 0.1em;
}

.yb-language-contact-card {
  position: relative;
  display: grid;
  gap: 24px;
  padding: 44px;
  background: linear-gradient(var(--yb-blue), var(--yb-blue)) top left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) bottom left 12px/calc(100% - 24px) 1px no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) left top 12px/1px calc(100% - 24px) no-repeat, linear-gradient(var(--yb-blue), var(--yb-blue)) right top 12px/1px calc(100% - 24px) no-repeat;
}

.yb-language-contact-card::before {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 8px;
  background: #d9edf7;
  pointer-events: none;
}

.yb-language-contact-card > * {
  position: relative;
  z-index: 1;
}

.yb-language-contact-card h3 {
  margin: 0;
  color: var(--yb-black);
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.yb-language-contact-card__list {
  display: grid;
  gap: 16px;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.yb-language-contact-card__row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.yb-language-contact-card__row:not(.is-strong) {
  min-height: 26px;
}

.yb-language-contact-card__row dt {
  display: grid;
  width: 96px;
  min-height: 24px;
  place-items: center;
  border: 1px solid var(--yb-black);
  border-radius: 4px;
  background: var(--yb-white);
  color: var(--yb-black);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-align: center;
}

.yb-language-contact-card__row dd {
  min-width: 0;
  margin: 0;
  color: #2f3336;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.yb-language-contact-card__row.is-strong dd {
  color: var(--yb-blue);
  font-family: var(--yb-font-en);
  font-size: 32px;
  letter-spacing: 0.03em;
  line-height: 1;
}

.yb-language-contact-card__row.is-fax dd,
.yb-language-contact-card__row.is-email dd {
  font-family: var(--yb-font-en);
  font-size: 22px;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-language-contact-card__row.is-address dd {
  font-size: 14px;
  line-height: 1.42;
}

.yb-language-contact-card__row a {
  color: inherit;
  text-decoration: none;
}

.yb-language-contact-card__row a[target=_blank] {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.12em;
}

.yb-language-contact-card__suffix {
  margin-left: 0.08em;
  font-size: 0.72em;
  white-space: nowrap;
}

.yb-language-contact-card__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 60px;
  margin-top: 8px;
  padding: 0 32px;
  border-radius: 999px;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-family: var(--yb-font-en);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
}

.yb-language-contact-card__button::after {
  content: "";
  display: block;
  width: 16px;
  height: 12px;
  flex: 0 0 auto;
  background-color: currentColor;
  mask-image: url("../img/common/arrow-black.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-language-en-top__lower-nav {
  margin-top: 0;
  padding-inline: 24px;
  background: transparent;
}

.yb-language-en-top__lower-nav .yb-lower-nav__meta {
  padding-inline: var(--yb-pad);
  background: var(--yb-white);
}

.yb-footer-cta--english .yb-pill-button {
  letter-spacing: 0.05em;
}

.yb-footer-cta--english .yb-pill-button span {
  line-height: 1.05;
}

.yb-footer--english .yb-footer__school-small {
  font-size: 16px;
  letter-spacing: 0.05em;
}

.yb-footer--english .yb-footer__school-name {
  font-size: 32px;
  letter-spacing: 0;
  line-height: 1.15;
}

.yb-footer--english .yb-footer__address {
  font-size: 14px;
  letter-spacing: 0.05em;
}

.yb-footer-cta {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  padding: 64px 0;
  background: var(--yb-white);
  position: relative;
}

.yb-footer-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: min(100%, var(--yb-shell));
  height: 46px;
  margin-left: auto;
  padding: 8px var(--yb-pad);
  border-bottom: 1px solid var(--yb-border);
  background: var(--yb-white);
  position: relative;
}

.yb-page-top {
  --yb-page-top-icon-color: currentColor;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--yb-gray);
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  transition: color 0.18s ease;
}

.yb-page-top::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 12px;
  flex: 0 0 auto;
  background-color: var(--yb-page-top-icon-color);
  mask-image: url("../img/common/chevron-up.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-page-top:hover,
.yb-page-top:focus-visible {
  --yb-page-top-icon-color: var(--yb-blue);
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-footer-cta__buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.yb-pill-button {
  --yb-icon-color: var(--yb-white);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 60px;
  padding: 10px 32px;
  border: 1px solid transparent;
  border-radius: 30px;
  background: var(--yb-blue);
  color: var(--yb-white);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

a.yb-pill-button:hover,
a.yb-pill-button:focus-visible {
  --yb-icon-color: var(--yb-blue);
  border-color: var(--yb-blue);
  background: var(--yb-blue-10);
  color: var(--yb-blue);
}

.yb-pill-button span {
  margin-right: auto;
}

.yb-pill-button::after {
  mask-image: url("../img/common/arrow-white.svg");
}

.yb-footer-cta__links {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: start;
  margin-top: 48px;
}

.yb-footer-cta__links nav:first-child {
  display: grid;
  gap: 16px;
}

.yb-footer-cta__links a,
.yb-footer-cta__links span,
.yb-footer__links a,
.yb-footer__links span {
  --yb-footer-link-icon-color: currentColor;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--yb-gray);
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration-color: var(--yb-gray);
  text-decoration-thickness: 8%;
  text-underline-offset: 0.2em;
  transition: color 0.18s ease;
}

.yb-footer-cta__links nav:first-child a::before,
.yb-footer-cta__links nav:first-child span::before,
.yb-footer__links a::before,
.yb-footer__links span::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  flex: 0 0 auto;
  background-color: var(--yb-footer-link-icon-color);
  mask-image: url("../img/common/chevron-right.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.yb-footer-cta__links a:hover,
.yb-footer-cta__links a:focus-visible,
.yb-footer__links a:hover,
.yb-footer__links a:focus-visible {
  --yb-footer-link-icon-color: var(--yb-blue);
  color: var(--yb-link-hover);
  text-decoration-line: underline;
  text-decoration-style: dotted;
}

.yb-footer-cta__sns {
  display: flex;
  align-items: center;
  gap: 24px;
  padding-right: 16px;
}

.yb-footer-cta__sns a {
  display: block;
}

.yb-footer-cta__sns img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.yb-footer {
  width: min(100%, var(--yb-shell));
  margin-left: auto;
  padding: 72px 0 32px;
  border-top: 1px solid var(--yb-border);
  background: var(--yb-white);
  position: relative;
}

.yb-footer-cta.yb-footer-cta--english {
  padding: 24px 24px 0;
  background: transparent;
}

.yb-footer.yb-footer--english {
  padding: 24px 24px 0;
  border-top: 0;
  background: transparent;
}

.yb-footer-cta--english .yb-shell,
.yb-footer--english .yb-shell {
  background: var(--yb-white);
}

.yb-footer-cta--english .yb-shell {
  padding-top: 64px;
  padding-bottom: 64px;
}

.yb-footer--english .yb-shell {
  padding-top: 72px;
  padding-bottom: 32px;
  border-top: 1px solid var(--yb-border);
}

.yb-footer__school-small,
.yb-footer__school-name,
.yb-footer__address,
.yb-footer__copy {
  margin: 0;
}

.yb-footer__school-small {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
}

.yb-footer__school-name {
  margin-top: 12px;
  font-size: 36px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
}

.yb-footer__address {
  margin-top: 16px;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

.yb-footer__links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 32px;
}

.yb-footer__copy {
  margin-top: 72px;
  font-family: var(--yb-font-en);
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1;
}

@media (max-width: 1360px) {
  .yb-header__subnav {
    gap: 24px;
  }
  .yb-header__subnav .yb-icon-link {
    justify-content: center;
    width: 18px;
    height: 18px;
    gap: 0;
    overflow: hidden;
    font-size: 0;
    letter-spacing: 0;
  }
  .yb-header__subnav .yb-icon-link::before {
    width: 18px;
    height: 18px;
  }
}
@media (max-width: 1180px) {
  .yb-header__nav {
    display: none;
  }
}
@media (max-width: 900px) {
  :root {
    --yb-header: 84px;
    --yb-pad: 24px;
  }
  main.main {
    --yb-pad: 24px;
  }
  .yb-page-heading--index {
    padding-inline: 22px;
  }
  .yb-page-heading:not(.yb-page-heading--index),
  .yb-teacher-detail__name-block,
  .yb-teacher-detail__career,
  .yb-teacher-detail__works,
  .yb-teacher-detail__book,
  .yb-value-page__inner,
  .yb-value-heading,
  .yb-value-panel,
  .yb-value-section,
  .yb-value-cycle,
  .yb-value-goals,
  .yb-value-next,
  .yb-value-step-list,
  .yb-value-step,
  .yb-value-feature-list,
  .yb-value-curriculum-section,
  .yb-language-en-top__panel {
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
  }
  .yb-value-page--index .yb-value-heading,
  .yb-value-page--index .yb-value-section--links,
  .yb-value-page--index .yb-value-section--interview,
  .yb-value-page--philosophy .yb-value-cycle,
  .yb-value-page--philosophy .yb-value-goals,
  .yb-value-page--philosophy .yb-value-goal-list li,
  .yb-value-page--detail .yb-value-next,
  .yb-value-page--curriculum .yb-value-curriculum-section {
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
  }
  .yb-header__main {
    align-items: center;
    gap: 0;
    padding: 24px 0 24px var(--yb-pad);
  }
  .yb-header__logo {
    width: 163px;
  }
  .yb-header__tools {
    margin-left: auto;
    gap: 0;
    padding: 0;
  }
  .yb-header__tool {
    width: 48px;
    height: var(--yb-header);
    flex: 0 0 48px;
  }
  .yb-header__tool--search img {
    width: 32px;
    height: 32px;
  }
  body.is-yb-menu-search-mode .yb-header__tool--search-trigger::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--yb-blue);
    transform: translate(-50%, -50%);
  }
  body.is-yb-menu-search-mode .yb-header__tool--search-trigger img {
    position: relative;
    z-index: 1;
    width: 20px;
    height: 20px;
    filter: brightness(0) invert(1);
  }
  .yb-header__tool--language {
    display: none;
  }
  .yb-header__language-panel {
    display: none;
    width: 0;
    flex-basis: 0;
    margin-left: 0;
    overflow: hidden;
  }
  .yb-header__language-panel img {
    transform: none;
  }
  .yb-header__tool-divider {
    display: none;
  }
  .yb-menu-button {
    flex-basis: 84px;
    gap: 6px;
  }
  .yb-menu-button span:not(.yb-visually-hidden) {
    width: 38px;
    height: 2px;
  }
  body.is-yb-menu-open .yb-menu-button span:nth-child(1) {
    transform: translateY(8px) rotate(18deg);
  }
  body.is-yb-menu-open .yb-menu-button span:nth-child(3) {
    transform: translateY(-8px) rotate(-18deg);
  }
  .yb-header__subnav {
    display: none;
  }
  .yb-menu__panel--japanese {
    min-height: 100%;
    overflow-y: auto;
  }
  .yb-menu {
    height: calc(100dvh - var(--yb-header));
  }
  .yb-menu__ja-layout {
    justify-content: flex-start;
    gap: 32px;
    height: auto;
    min-height: 100%;
  }
  .yb-menu__ja-main {
    display: block;
    flex: 0 0 auto;
    padding: 16px 24px 0;
  }
  .yb-menu__ja-search-row {
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 32px;
    padding: 6px 2px 4px 0;
    border-bottom: 1px solid var(--yb-blue);
  }
  body.is-yb-menu-search-mode .yb-menu__ja-search-row {
    display: flex;
  }
  .yb-menu__ja-search-form {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
    color: var(--yb-gray);
    font-family: var(--yb-font-en);
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1;
  }
  .yb-menu__ja-search-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .yb-menu__ja-search-submit img {
    display: block;
    width: 32px;
    height: 32px;
    object-fit: contain;
  }
  .yb-menu__ja-search-input {
    min-width: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--yb-black);
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
  }
  .yb-menu__ja-search-input::-webkit-search-decoration,
  .yb-menu__ja-search-input::-webkit-search-cancel-button,
  .yb-menu__ja-search-input::-webkit-search-results-button,
  .yb-menu__ja-search-input::-webkit-search-results-decoration {
    display: none;
    -webkit-appearance: none;
    appearance: none;
  }
  .yb-menu__ja-search-input::-ms-clear {
    display: none;
    width: 0;
    height: 0;
  }
  .yb-menu__ja-search-input::placeholder {
    color: var(--yb-gray);
    opacity: 1;
  }
  .yb-menu__ja-search-input:focus {
    outline: 0;
  }
  .yb-menu__ja-search-close {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    background: url("../img/common/menu-search-close.svg") center/contain no-repeat;
    cursor: pointer;
  }
  .yb-menu__ja-sections {
    display: grid;
    gap: 12px;
    overflow: visible;
    padding-bottom: 16px;
  }
  .yb-menu__ja-section-link {
    padding: 12px 8px 8px 2px;
    border-bottom-width: 1px;
    font-size: 18px;
    line-height: 1.5;
  }
  .yb-menu__ja-section-link::before,
  .yb-menu__ja-child-link::before {
    display: none;
  }
  .yb-menu__ja-section-link::after {
    width: 12px;
    height: 18px;
    flex: 0 0 12px;
    background: url("../img/common/menu-pulldown-open.svg") center/contain no-repeat;
    mask: none;
    -webkit-mask: none;
    transform: none;
  }
  .yb-menu__ja-section-link.is-active {
    border-bottom-width: 1px;
    font-weight: 400;
  }
  .yb-menu__ja-section-link:hover,
  .yb-menu__ja-section-link:focus-visible {
    border-bottom: 1px solid var(--yb-line);
    font-weight: 400;
  }
  .yb-menu__ja-section-link.is-active::after,
  .yb-menu__ja-section-link:hover::after,
  .yb-menu__ja-section-link:focus-visible::after {
    background-image: url("../img/common/menu-pulldown-open.svg");
    transform: none;
  }
  .yb-menu__ja-section.is-open .yb-menu__ja-section-link,
  .yb-menu__ja-section-link.is-current {
    border-bottom: 2px solid var(--yb-blue);
    color: var(--yb-black);
    font-weight: 500;
  }
  .yb-menu__ja-section.is-open .yb-menu__ja-section-link::after,
  .yb-menu__ja-section-link.is-current::after {
    background-image: url("../img/common/menu-pulldown-close.svg");
    transform: none;
  }
  .yb-menu__ja-children-wrap {
    display: none;
  }
  .yb-menu__ja-accordion {
    display: block;
    padding: 12px 0 24px 16px;
  }
  .yb-menu__ja-child-list--sp {
    display: grid;
    align-content: start;
    gap: 0;
  }
  .yb-menu__ja-child-link {
    padding: 12px 2px 8px;
    border-bottom: 1px dashed var(--yb-line);
    font-size: 18px;
    line-height: 1.5;
  }
  .yb-menu__ja-child-link::after {
    width: 24px;
    height: 24px;
    mask-size: 15px auto;
    -webkit-mask-size: 15px auto;
  }
  .yb-menu__ja-child-link:hover,
  .yb-menu__ja-child-link:focus-visible {
    --yb-menu-link-border-color: var(--yb-line);
    --yb-menu-link-arrow-color: var(--yb-black);
    border-bottom: 1px dashed var(--yb-line);
    font-weight: 400;
  }
  .yb-menu__ja-sp-global {
    display: grid;
    gap: 36px;
    flex: 0 0 auto;
    border-bottom: 1px solid var(--yb-line);
    padding-bottom: 36px;
  }
  .yb-menu__ja-audience-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100vw;
    max-width: 100vw;
    border-top: 1px solid var(--yb-line);
    border-bottom: 1px solid var(--yb-line);
  }
  .yb-menu__ja-audience-grid a {
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 0 12px 0 24px;
    border-top: 1px solid var(--yb-line);
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.2;
  }
  .yb-menu__ja-audience-grid a:nth-child(-n+2) {
    border-top: 0;
  }
  .yb-menu__ja-audience-grid a:nth-child(even) {
    border-left: 1px solid var(--yb-line);
  }
  .yb-menu__ja-sp-tools {
    display: grid;
    gap: 14px;
    padding: 0 24px;
  }
  .yb-menu__ja-cta {
    display: flex;
    align-items: center;
    gap: 36px;
    flex-wrap: nowrap;
  }
  .yb-menu__ja-cta .yb-icon-link {
    gap: 8px;
    color: var(--yb-black);
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.05em;
    line-height: 1;
    white-space: nowrap;
  }
  .yb-menu__ja-cta .yb-icon-link::before {
    width: 32px;
    height: 32px;
  }
  .yb-menu__ja-language {
    position: relative;
    color: var(--yb-black);
    margin-right: -24px;
    padding-right: 24px;
    overflow: hidden;
  }
  .yb-menu__ja-language summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    list-style: none;
    font-size: 18px;
    line-height: 1;
  }
  .yb-menu__ja-language summary::-webkit-details-marker {
    display: none;
  }
  .yb-menu__ja-language summary::after {
    content: "";
    width: 12px;
    height: 18px;
    flex: 0 0 12px;
    margin-left: 12px;
    background: url("../img/common/menu-pulldown-open.svg") center/contain no-repeat;
  }
  .yb-menu__ja-language[open] summary::after {
    background-image: url("../img/common/menu-pulldown-close.svg");
  }
  .yb-menu__ja-language-icon {
    display: block;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    object-fit: contain;
  }
  .yb-menu__ja-language-links {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 12px;
    margin-left: calc(var(--yb-pad) * -1);
    margin-right: calc(var(--yb-pad) * -1);
    padding: 12px 24px 0 var(--yb-pad);
    overflow-x: auto;
    color: var(--yb-black);
    font-family: var(--yb-font-en);
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1;
    scrollbar-width: none;
    white-space: nowrap;
  }
  .yb-menu__ja-language-links::-webkit-scrollbar {
    display: none;
  }
  .yb-menu__ja-language-links a {
    flex: 0 0 auto;
  }
  .yb-menu__ja-language-links a.is-current {
    color: var(--yb-blue);
    font-family: var(--yb-font-jp);
  }
  .yb-menu__ja-footer {
    display: grid;
    gap: 40px;
    min-height: 0;
    padding: 0 0 calc(48px + env(safe-area-inset-bottom));
    overflow: hidden;
  }
  .yb-menu__ja-footer-links {
    gap: 24px;
    padding: 0 24px;
  }
  .yb-menu__ja-sns {
    gap: 24px;
  }
  .yb-menu__ja-sns img {
    width: 40px;
    height: 40px;
  }
  .yb-menu__ja-sns a:last-child img {
    width: 50px;
    height: 35px;
  }
  .yb-menu__ja-related {
    gap: 16px;
    padding-left: 4px;
  }
  .yb-menu__ja-related a {
    gap: 8px;
    font-size: 14px;
  }
  .yb-menu__ja-related a::before {
    width: 6px;
    height: 8px;
  }
  .yb-menu__ja-brand {
    width: 100vw;
    max-width: none;
    flex-basis: auto;
    padding-left: 4px;
  }
  .yb-menu__ja-brand img {
    width: 97%;
    max-width: none;
  }
  .yb-language-en-top__fixed-bg {
    position: relative;
    top: auto;
    left: auto;
    z-index: 1;
    width: 100%;
    height: 420px;
  }
  .yb-language-common-bg__image {
    left: 50%;
    width: max(100%, 420px * 2880 / 1624);
  }
  .yb-language-common-bg__yokobi {
    height: min(92%, 360px);
  }
  .yb-language-en-top {
    width: 100%;
    margin-left: 0;
    border-left: 0;
  }
  .yb-language-en-top__inner {
    padding: 24px;
  }
  .yb-language-en-top__panel {
    padding: 40px 24px 72px;
  }
  .yb-menu__panel--language {
    overflow-y: auto;
  }
  .yb-menu__language-layout {
    justify-content: flex-start;
    gap: 32px;
    height: auto;
    min-height: 100%;
  }
  .yb-menu__language-main {
    display: block;
    flex: 0 0 auto;
    padding: 16px 24px 0;
  }
  .yb-menu__language-columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .yb-menu__language-list a,
  .yb-menu__language-pages a {
    padding: 12px 8px 8px 2px;
    border-bottom-width: 1px;
    font-size: 18px;
    line-height: 1.5;
  }
  .yb-menu__language-list a::after,
  .yb-menu__language-pages a::after {
    width: 12px;
    height: 18px;
    flex: 0 0 12px;
    background: url("../img/common/menu-pulldown-open.svg") center/14px auto no-repeat;
    mask: none;
    -webkit-mask: none;
    transform: none;
  }
  .yb-menu__language-list a.is-current,
  .yb-menu__language-list a:hover,
  .yb-menu__language-list a:focus-visible {
    border-bottom: 2px solid var(--yb-blue);
    font-weight: 500;
  }
  .yb-menu__language-list a.is-current::after,
  .yb-menu__language-list a:hover::after,
  .yb-menu__language-list a:focus-visible::after {
    background-image: url("../img/common/menu-pulldown-close.svg");
    transform: none;
  }
  .yb-menu__language-pages {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  .yb-menu__language-pages a {
    min-height: 29px;
    padding: 9px 2px 7px;
    border-bottom: 1px dashed var(--yb-line);
    font-size: 15px;
  }
  .yb-menu__language-pages a::after {
    width: 24px;
    height: 24px;
    border: 0;
    background: url("../img/common/arrow-black.svg") center/15px auto no-repeat;
    mask: none;
    -webkit-mask: none;
    transform: none;
  }
  .yb-menu__language-sp-global {
    display: grid;
    gap: 22px;
    flex: 0 0 auto;
    border-bottom: 1px solid var(--yb-line);
    padding-bottom: 32px;
  }
  .yb-menu__language-cta--desktop {
    display: none;
  }
  .yb-menu__language-actions {
    gap: 14px;
    padding: 0 24px;
  }
  .yb-menu__language-footer {
    display: grid;
    gap: 40px;
    min-height: 0;
    padding: 0 0 calc(48px + env(safe-area-inset-bottom));
    overflow: hidden;
  }
  .yb-menu__language-brand {
    width: 100%;
    max-width: none;
    flex-basis: auto;
    padding-left: 4px;
  }
  .yb-menu__language-brand img {
    width: 300px;
    max-width: none;
  }
  .yb-menu__language-cta,
  .yb-menu__language-sns,
  .yb-menu__language-related {
    flex-wrap: wrap;
  }
  .yb-language-en-president__summary {
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 18px;
  }
  .yb-language-en-president__image {
    width: 150px;
    height: 112px;
  }
  .yb-footer--english .yb-footer__school-name {
    white-space: normal;
  }
  .yb-hero__sp-static {
    position: relative;
    display: block;
    width: 100%;
    height: calc(100svh - var(--yb-header));
    overflow: hidden;
    background: var(--yb-white);
    z-index: 1;
  }
  .yb-hero__sp-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .yb-hero__sp-yokobi {
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: 100vw;
    height: auto;
    aspect-ratio: 800/143.28;
    pointer-events: none;
  }
  .yb-hero__sp-yokobi img {
    margin-left: 1%;
    width: 96%;
    height: auto;
    object-fit: contain;
  }
  .yb-hero__fixed-layer--text {
    position: absolute;
    top: clamp(24px, 6vw, 48px);
    left: var(--yb-pad);
    width: min(480px, 100vw - var(--yb-pad) * 2);
    height: auto;
    object-fit: contain;
    animation: yb-hero-fixed-text-in 1.05s cubic-bezier(0.65, 0, 0.35, 1) 0.65s both;
  }
  .yb-hero__slides {
    display: none;
  }
  .yb-home-strip {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding-top: 36px;
    background: transparent;
  }
  .yb-hero__banners {
    order: 1;
    width: 100%;
    height: auto;
    flex: none;
    gap: 2px;
    margin-left: 0;
  }
  .yb-hero__banner {
    display: block;
    flex: 1 1 0;
    width: auto;
    height: auto;
    min-width: 0;
  }
  .yb-hero__banner img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  .yb-hero__thumbs {
    order: 1;
    width: 100%;
    height: auto;
    flex: none;
    gap: 2px;
    padding: 0 var(--yb-pad);
  }
  .yb-hero__thumb {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    width: auto;
    height: auto;
    aspect-ratio: auto;
  }
  .yb-hero__thumb img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
  }
  .yb-hero__thumb::after {
    inset: 0 0 2px;
  }
  .yb-hero__thumb span {
    position: relative;
    left: auto;
    bottom: auto;
    flex: 0 0 2px;
    height: 2px;
  }
  .yb-course-card {
    --yb-course-card-photo-left: 13.333333%;
    --yb-course-card-photo-top: 10%;
    --yb-course-card-photo-width: 73.333333%;
    --yb-course-card-photo-height: 80%;
    --yb-course-card-photo-hover-left: 10%;
    --yb-course-card-photo-hover-top: 7.5%;
    --yb-course-card-photo-hover-width: 80%;
    --yb-course-card-photo-hover-height: 85%;
    container-type: inline-size;
  }
  .yb-course-card__en {
    right: 13.333333%;
    bottom: 10%;
    font-size: 4.444444cqw;
  }
  .yb-vision__chart {
    width: min(320px, 100vw - var(--yb-pad) * 2);
    margin: 24px auto 0;
  }
  .yb-access__route-map .yb-map-frame,
  .yb-map-frame.yb-access__bus-map {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  .yb-access .yb-map-frame img {
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }
  .yb-route-list {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .yb-route-steps--access {
    flex-wrap: wrap;
    row-gap: 4px;
  }
  .yb-route-steps--access li {
    white-space: normal;
  }
  .yb-route-steps--access-bus {
    flex-direction: column;
    gap: 28px;
  }
  .yb-route-steps--access-bus li {
    width: 100%;
    flex: 0 0 auto;
    min-height: 76px;
    padding: 12px 16px;
  }
  .yb-route-steps--access-bus li + li::before {
    left: 50%;
    top: -24px;
    width: 32px;
    height: 20px;
    transform: translateX(-50%) rotate(90deg);
  }
  .yb-home-strip__news {
    order: 2;
    width: 100%;
    height: auto;
    flex-direction: column;
    gap: 12px;
    margin-top: 32px;
    padding: 0 24px 72px;
  }
  .yb-home-strip__news h2 {
    padding-bottom: 16px;
    border-right: none;
    border-bottom: 1px solid var(--yb-border);
    font-size: 20px;
  }
  .yb-home-strip__news ul {
    flex: 1 1 auto;
    min-width: 0;
    gap: 8px;
    width: 100%;
  }
  .yb-home-strip__news a {
    gap: 16px;
    height: auto;
  }
  .yb-home-strip__news time {
    font-size: 16px;
  }
  .yb-home-strip__news span {
    font-size: 14px;
  }
  .yb-split-section {
    display: block;
  }
  .yb-senpai {
    --yb-senpai-scale: min(1, calc((100vw - (var(--yb-pad) * 2)) / 656px));
  }
  .yb-senpai__inner {
    min-height: 0;
    padding-inline: var(--yb-pad);
    overflow-x: hidden;
  }
  .yb-senpai-carousel {
    left: 50%;
    width: 656px;
    max-width: none;
    margin-left: -328px;
    margin-right: 0;
    margin-bottom: calc(760px * var(--yb-senpai-scale) - 760px);
    transform: scale(var(--yb-senpai-scale));
    transform-origin: top center;
  }
  .yb-senpai__movie {
    width: 100%;
    max-width: 640px;
    height: auto;
  }
  .yb-president-message__fixed-bg {
    display: none;
  }
  .yb-president-message__inner {
    padding-inline: var(--yb-pad);
  }
  .yb-president-message__inner .yb-page-heading {
    padding-inline: 0;
  }
  .yb-president-message__lead,
  .yb-president-message__body,
  .yb-president-message__profile {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-president-message__statement,
  .yb-president-message__name {
    width: 100%;
    max-width: 100%;
  }
  .yb-department-index__fixed-bg {
    display: none;
  }
  .yb-department-index__course-nav ul {
    grid-template-columns: 1fr;
  }
  .yb-department-index__details {
    padding: 0;
  }
  .yb-department-index__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
  }
  .yb-department-card {
    --yb-department-card-scale: calc((100vw / 2) / 304px);
    width: 100%;
    max-width: none;
    height: calc(470px * var(--yb-department-card-scale));
    overflow: hidden;
    padding: 0;
  }
  .yb-department-card::before {
    inset: auto;
    top: 0;
    left: 0;
    width: 304px;
    height: 470px;
    transform: scale(var(--yb-department-card-scale));
    transform-origin: top left;
  }
  .yb-department-card a {
    left: calc(8px * var(--yb-department-card-scale));
    top: calc(8px * var(--yb-department-card-scale));
    width: 288px;
    height: 454px;
    min-height: 0;
    transform: scale(var(--yb-department-card-scale));
    transform-origin: top left;
  }
  .yb-teacher-list__fixed-bg {
    display: none;
  }
  .yb-teacher-list__inner {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-teacher-list__heading {
    padding-inline: var(--yb-pad);
  }
  .yb-teacher-list__anchor {
    margin-inline: var(--yb-pad);
  }
  .yb-teacher-list__section {
    padding-inline: var(--yb-pad);
  }
  .yb-campus-map__fixed-bg {
    display: none;
  }
  .yb-campus-map__lead,
  .yb-campus-map__map-image,
  .yb-campus-map__virtual,
  .yb-campus-map__virtual-heading,
  .yb-campus-map__virtual-frame {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-campus-map__map-image img,
  .yb-campus-map__virtual-frame iframe {
    width: 100%;
    max-width: 100%;
  }
  .yb-senpai-index::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: #fff url("../img/about/speciality/senpai/bg-index.svg") right var(--yb-header)/min(720px, 100%) auto no-repeat;
  }
  .yb-senpai-index__content {
    z-index: 1;
    background: transparent;
  }
  .yb-senpai-index__inner {
    z-index: 1;
    min-height: 0;
    padding: 40px var(--yb-pad) 64px;
  }
  .yb-senpai-index__heading {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
  }
  .yb-senpai-index__list {
    grid-auto-flow: row;
    grid-template-columns: 280px;
    justify-content: center;
    gap: 56px;
    width: 100%;
    margin: 48px auto 0;
    padding-bottom: 0;
  }
  .yb-senpai-index__list .yb-senpai-index-card:nth-child(odd),
  .yb-senpai-index__list .yb-senpai-index-card:nth-child(even) {
    grid-column: auto;
    transform: none;
  }
  .yb-senpai-index__links,
  .yb-senpai-index__list--ends-left + .yb-senpai-index__links {
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%;
    max-width: 304px;
    margin: 56px auto 0;
  }
  .yb-senpai-index__links a {
    box-sizing: border-box;
    width: 100%;
  }
  .yb-senpai-detail__inner {
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
    box-sizing: border-box;
  }
  .yb-senpai-detail__course,
  .yb-senpai-detail__photographers {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-senpai-detail__course figure {
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-senpai-detail__course img {
    display: block;
    max-width: 100%;
    height: auto;
  }
  .yb-senpai-detail__course-link {
    box-sizing: border-box;
    max-width: 100%;
  }
  .yb-senpai-detail-voice {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-senpai-detail__photographers-intro,
  .yb-senpai-detail__photographers ul {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-senpai-detail__photographers {
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
  }
  .yb-senpai-detail__photographers-intro {
    padding-left: 0;
  }
  .yb-senpai-detail__photographers-intro br {
    display: none;
  }
  .yb-senpai-detail__photographers-item {
    gap: 16px;
    padding-right: 0;
    padding-left: 0;
  }
  .yb-senpai-detail__photographers-name-row {
    display: grid;
    align-items: start;
    gap: 6px;
  }
  .yb-senpai-detail__related {
    margin-right: 0;
    margin-left: 0;
    overflow: visible;
  }
  .yb-senpai-detail__related-heading {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-senpai-detail__related-carousel {
    width: 100vw;
    margin-right: calc(var(--yb-pad) * -1);
    margin-left: calc(var(--yb-pad) * -1);
    overflow: hidden;
  }
  .yb-senpai-detail__related-carousel > ul[data-yb-related-track] {
    padding-left: var(--yb-pad);
    scroll-padding-left: var(--yb-pad);
    scroll-padding-right: var(--yb-pad);
  }
  .yb-senpai-detail__related-carousel > ul[data-yb-related-track]::after {
    flex-basis: var(--yb-pad);
  }
  .yb-senpai-detail__related-arrow--prev {
    left: 8px;
  }
  .yb-senpai-detail__related-arrow--next {
    right: 8px;
  }
  .yb-split-section__visual {
    display: none;
  }
  .yb-split-section__content {
    width: 100%;
  }
  .yb-card-grid,
  .yb-icon-link-grid,
  .yb-link-grid,
  .yb-download-card-grid,
  .yb-action-card-grid,
  .yb-graduate-index__service-grid,
  .yb-general-index__service-grid,
  .yb-footer-cta__buttons,
  .yb-footer__links {
    grid-template-columns: 1fr;
  }
  .yb-index-card__image {
    height: auto;
    aspect-ratio: 296/222;
  }
  .yb-footer-cta__links {
    grid-template-columns: 1fr;
  }
  .yb-footer-cta__sns {
    order: -1;
    justify-content: flex-start;
    padding-right: 0;
  }
  .yb-lower-page .yb-value-section--interview,
  .yb-value-voice-card a {
    width: 100%;
  }
  .yb-lower-page .yb-value-section--interview {
    width: calc(100% - 24px);
    margin-right: 12px;
    margin-left: 12px;
    padding: 48px 24px;
    gap: 32px;
  }
  .yb-value-interview-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .yb-value-interview-head img {
    width: 195px;
    height: 48px;
    object-fit: contain;
  }
  .yb-value-voice-card {
    width: min(100%, 328px);
    margin-right: auto;
    margin-left: auto;
    background: linear-gradient(#80d0f4, #80d0f4) left top 112px/1px calc(100% - 128px) no-repeat;
  }
  .yb-value-voice-card {
    --yb-value-voice-bottom-line: 100%;
    --yb-value-voice-caption-space: 119px;
  }
  .yb-value-voice-card:nth-child(2) {
    --yb-value-voice-caption-space: 107px;
  }
  .yb-value-voice-card:nth-child(3) {
    --yb-value-voice-caption-space: 95px;
  }
  .yb-value-voice-card::after {
    width: calc(100% - var(--yb-value-voice-caption-space));
  }
  .yb-value-voice-card a {
    grid-template-columns: 1fr;
  }
  .yb-value-voice-card__image {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
  }
  .yb-value-voice-card__image img {
    object-fit: contain;
  }
  .yb-value-fixed-bg--philosophy {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    z-index: 0;
    width: 100%;
    height: 240px;
    overflow: hidden;
    background: var(--yb-white);
  }
  .yb-value-fixed-bg--philosophy .yb-fixed-bg__layer,
  .yb-value-page--philosophy::after {
    display: none;
  }
  .yb-value-fixed-bg--philosophy .yb-value-fixed-bg__photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    aspect-ratio: auto;
    transform: none;
    object-fit: cover;
    object-position: center bottom;
  }
  .yb-value-page--philosophy {
    background: var(--yb-white);
  }
  .yb-value-page--philosophy .yb-value-page__inner {
    width: 100%;
    padding: 40px var(--yb-pad) 0;
    background: var(--yb-white);
  }
  .yb-value-page--philosophy .yb-value-panel,
  .yb-value-page--philosophy .yb-value-content {
    width: 100%;
    margin: 0;
    background: var(--yb-white);
  }
  .yb-value-page--philosophy .yb-value-panel {
    padding: 0 0 16px;
  }
  .yb-value-page--philosophy .yb-value-heading.yb-page-heading {
    padding: 0;
  }
  .yb-value-page--philosophy .yb-value-content {
    gap: 48px;
    padding: 48px 0;
    grid-template-columns: 1fr;
  }
  .yb-value-page--philosophy .yb-value-cycle,
  .yb-value-page--philosophy .yb-value-goals {
    display: grid;
    width: 100%;
    height: auto;
    padding-right: 0;
    padding-left: 0;
  }
  .yb-value-page--philosophy .yb-value-cycle {
    gap: 24px;
  }
  .yb-value-cycle__lead,
  .yb-value-page--philosophy .yb-value-goals .yb-section-lead {
    margin-top: -8px;
  }
  .yb-value-page--philosophy .yb-value-cycle__chart {
    width: 100%;
    height: auto;
    aspect-ratio: 352/320;
    margin-top: 0;
    padding: 0;
    place-items: start center;
  }
  .yb-value-page--philosophy .yb-value-cycle__chart figure {
    width: min(74%, 259px);
    margin-top: 40px;
  }
  .yb-value-page--philosophy .yb-value-cycle-list {
    grid-template-columns: 1fr;
    gap: 16px;
    width: 100%;
    height: auto;
    margin-top: 0;
  }
  .yb-value-page--philosophy .yb-value-cycle-card {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    width: 100%;
    height: auto;
  }
  .yb-value-page--philosophy .yb-value-cycle-card img {
    grid-column: 1;
    grid-row: 1;
    width: 140px;
  }
  .yb-value-page--philosophy .yb-value-cycle-card p {
    grid-column: 2;
    margin-top: 0;
    font-size: 13px;
    line-height: 1.6;
  }
  .yb-value-page--philosophy .yb-value-goals {
    gap: 24px;
  }
  .yb-value-page--philosophy .yb-value-goal-list {
    gap: 8px;
    width: 100%;
    margin-top: 0;
  }
  .yb-value-page--philosophy .yb-value-goal-list li {
    width: 100%;
    height: 96px;
    padding: 16px;
    font-size: 18px;
  }
  .yb-value-page--detail .yb-value-next {
    width: calc(100% + var(--yb-pad) * 2);
    height: auto;
    margin-right: calc(var(--yb-pad) * -1);
    margin-left: calc(var(--yb-pad) * -1);
    padding: 48px var(--yb-pad);
  }
  .yb-value-page--detail .yb-value-next__link,
  .yb-value-page--detail.yb-value-page--philosophy .yb-value-next__link {
    width: 100%;
    min-height: 122px;
    padding-right: 24px;
    padding-left: 24px;
  }
  .yb-value-page--philosophy .yb-value-next__title,
  .yb-value-page--step .yb-value-next__title {
    white-space: normal;
  }
  .yb-value-page--philosophy .yb-value-next__title span,
  .yb-value-page--step .yb-value-next__title span {
    display: block;
  }
  .yb-value-fixed-bg--step {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    z-index: 0;
    width: 100%;
    height: 240px;
    overflow: hidden;
    background: var(--yb-white);
  }
  .yb-value-fixed-bg--step .yb-fixed-bg__layer,
  .yb-value-page--step::after {
    display: none;
  }
  .yb-value-fixed-bg--step .yb-value-fixed-bg__photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    aspect-ratio: auto;
    transform: none;
    object-fit: cover;
    object-position: center;
  }
  .yb-value-fixed-bg--step .yb-value-fixed-bg__text {
    left: auto;
    right: 16px;
    top: auto;
    bottom: 0;
    width: 164px;
    height: auto;
  }
  .yb-value-page--step {
    background: var(--yb-white);
  }
  .yb-value-page--step .yb-value-page__inner {
    width: 100%;
    padding: 40px var(--yb-pad) 0;
    background: var(--yb-white);
  }
  .yb-value-page--step .yb-value-panel,
  .yb-value-page--step .yb-value-step-list {
    width: 100%;
    margin: 0;
    background: var(--yb-white);
  }
  .yb-value-page--step .yb-value-panel {
    padding: 0 0 16px;
  }
  .yb-value-page--step .yb-value-heading.yb-page-heading {
    padding: 0;
  }
  .yb-value-page--step .yb-value-heading h1 {
    font-size: 24px;
    line-height: 1.35;
  }
  .yb-value-page--step .yb-value-heading__description {
    margin-top: 16px;
  }
  .yb-value-page--step .yb-value-step-list {
    height: auto;
    padding: 48px 0 0;
    gap: 0;
  }
  .yb-value-page--step .yb-value-step {
    width: 100%;
    padding: 0 0 48px;
    gap: 16px;
    align-content: start;
  }
  .yb-value-page--step .yb-value-step__head {
    height: 48px;
    align-items: center;
    gap: 24px;
  }
  .yb-value-page--step .yb-value-step__num {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    font-size: 32px;
  }
  .yb-value-page--step .yb-value-step__head h2 {
    margin: 0;
    font-size: 32px;
    line-height: 1;
  }
  .yb-value-page--step .yb-value-step__main,
  .yb-value-step--01 .yb-value-step__main,
  .yb-value-step--02 .yb-value-step__main,
  .yb-value-step--03 .yb-value-step__main,
  .yb-value-step--04 .yb-value-step__main {
    grid-template-columns: 48px minmax(0, 1fr);
    column-gap: 24px;
    height: auto;
  }
  .yb-value-page--step .yb-value-step__label {
    width: 48px;
    height: 100%;
    max-width: none;
  }
  .yb-value-page--step .yb-value-step__panel {
    width: 100%;
    min-width: 0;
    margin-bottom: 24px;
  }
  .yb-value-page--step .yb-value-step--04 .yb-value-step__panel {
    margin-bottom: 0;
  }
  .yb-value-page--step .yb-value-step__chart {
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
  }
  .yb-value-page--step .yb-value-step--01 .yb-value-step__chart {
    aspect-ratio: 280/258;
    height: auto;
  }
  .yb-value-page--step .yb-value-step--02 .yb-value-step__chart {
    aspect-ratio: 280/356;
    height: auto;
  }
  .yb-value-page--step .yb-value-step--03 .yb-value-step__chart {
    aspect-ratio: 280/287;
    height: auto;
  }
  .yb-value-page--step .yb-value-step--04 .yb-value-step__chart {
    aspect-ratio: 280/289;
    height: auto;
  }
  .yb-value-page--step .yb-value-step__lottie {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .yb-value-page--step .yb-value-step__lottie svg,
  .yb-value-page--step .yb-value-step__lottie-fallback {
    width: auto;
    height: auto;
    object-fit: contain;
  }
  .yb-value-page--step .yb-value-step--01 .yb-value-step__chart img,
  .yb-value-page--step .yb-value-step--02 .yb-value-step__chart img {
    width: 69.74%;
    height: auto;
  }
  .yb-value-page--step .yb-value-step--03 .yb-value-step__chart img {
    width: 81.14%;
    height: auto;
  }
  .yb-value-page--step .yb-value-step--04 .yb-value-step__chart img {
    width: 82.68%;
    height: auto;
  }
  .yb-value-page--step .yb-value-step__text {
    width: calc(100% - 32px);
    height: auto;
    min-height: 164px;
    margin: 16px auto 32px;
    padding: 24px;
  }
  .yb-value-page--step .yb-value-step--02 .yb-value-step__text,
  .yb-value-page--step .yb-value-step--03 .yb-value-step__text {
    min-height: 240px;
  }
  .yb-value-page--step .yb-value-step--04 .yb-value-step__text {
    min-height: 196px;
  }
  .yb-value-page--step .yb-value-step__text h3 {
    font-size: 16px;
    line-height: 1.5;
  }
  .yb-value-page--step .yb-value-step__text p {
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.6;
  }
  .yb-value-fixed-bg--curriculum {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    z-index: 0;
    width: 100%;
    height: 240px;
    overflow: hidden;
    background: var(--yb-white);
  }
  .yb-value-fixed-bg--curriculum .yb-fixed-bg__layer,
  .yb-value-page--curriculum::after {
    display: none;
  }
  .yb-value-fixed-bg--curriculum .yb-value-fixed-bg__photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    aspect-ratio: auto;
    transform: none;
    object-fit: cover;
    object-position: center;
  }
  .yb-value-fixed-bg--curriculum .yb-value-fixed-bg__text {
    left: auto;
    right: 16px;
    top: auto;
    bottom: 0;
    width: 164px;
    height: auto;
  }
  .yb-value-page--curriculum {
    background: var(--yb-white);
  }
  .yb-value-page--curriculum .yb-value-page__inner {
    width: 100%;
    padding: 40px var(--yb-pad) 0;
    background: var(--yb-white);
  }
  .yb-value-page--curriculum .yb-value-panel,
  .yb-value-page--curriculum .yb-value-content,
  .yb-value-page--curriculum .yb-value-feature-list,
  .yb-value-page--curriculum .yb-value-feature-card,
  .yb-value-page--curriculum .yb-value-curriculum-section {
    width: 100%;
    margin: 0;
    background: var(--yb-white);
  }
  .yb-value-page--curriculum .yb-value-panel {
    padding: 0 0 16px;
  }
  .yb-value-page--curriculum .yb-value-heading.yb-page-heading {
    padding: 0;
  }
  .yb-value-page--curriculum .yb-value-content {
    gap: 48px;
    padding: 48px 0;
  }
  .yb-value-page--curriculum .yb-value-feature-list {
    gap: 48px;
    padding: 0;
  }
  .yb-value-page--curriculum .yb-value-feature-card__image,
  .yb-value-page--curriculum .yb-value-feature-card__body {
    width: 100%;
    margin-left: 0;
  }
  .yb-value-page--curriculum .yb-value-feature-card__image {
    height: auto;
    aspect-ratio: 528/220;
  }
  .yb-value-page--curriculum .yb-value-feature-card__body {
    padding: 24px;
  }
  .yb-value-page--curriculum .yb-value-feature-card__body h2 {
    font-size: 22px;
  }
  .yb-value-page--curriculum .yb-value-curriculum-section,
  .yb-value-page--curriculum .yb-value-curriculum-section--multi-row {
    display: grid;
    gap: 24px;
    height: auto;
    padding: 0;
  }
  .yb-value-page--curriculum .yb-value-small-card-grid,
  .yb-value-page--curriculum .yb-value-curriculum-section--multi-row .yb-value-small-card-grid {
    grid-template-columns: 1fr;
    gap: 40px;
    height: auto;
    margin-top: 0;
  }
  .yb-value-page--curriculum .yb-value-small-card {
    height: auto;
  }
  .yb-value-page--curriculum .yb-value-small-card__image {
    height: auto;
    aspect-ratio: 4/3;
  }
  .yb-value-page--curriculum .yb-value-small-card__body h3 {
    display: flex;
    padding-right: 0;
    white-space: normal;
    line-height: 1.5;
  }
  .yb-value-page--curriculum .yb-value-small-card__body h3::after {
    position: static;
    transform: none;
  }
  .yb-learning-common__fixed-bg,
  .yb-learning-context__fixed-bg,
  .yb-learning-curator__fixed-bg,
  .yb-learning-web__fixed-bg,
  .yb-learning-teacher__fixed-bg {
    display: none;
  }
  .yb-learning-common__inner,
  .yb-learning-context__inner,
  .yb-learning-curator__inner,
  .yb-learning-web__inner,
  .yb-learning-teacher__inner {
    width: 100%;
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
    box-sizing: border-box;
  }
  .yb-learning-common__content,
  .yb-learning-context__content,
  .yb-learning-curator__content,
  .yb-learning-web__content,
  .yb-learning-teacher__content,
  .yb-learning-common__heading,
  .yb-learning-context__heading,
  .yb-learning-curator__heading,
  .yb-learning-web__heading,
  .yb-learning-teacher__heading,
  .yb-learning-common__section,
  .yb-learning-context__section,
  .yb-learning-curator__section,
  .yb-learning-web__section,
  .yb-learning-teacher__section,
  .yb-learning-shared__pickup,
  .yb-learning-shared__section--related {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-learning-common__content,
  .yb-learning-context__content,
  .yb-learning-curator__content,
  .yb-learning-web__content,
  .yb-learning-teacher__content {
    gap: 48px;
  }
  .yb-learning-common__heading.yb-page-heading,
  .yb-learning-context__heading.yb-page-heading,
  .yb-learning-curator__heading.yb-page-heading,
  .yb-learning-web__heading.yb-page-heading,
  .yb-learning-teacher__heading.yb-page-heading {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-learning-common__section.yb-page-section,
  .yb-learning-context__section.yb-page-section,
  .yb-learning-curator__section.yb-page-section,
  .yb-learning-web__section.yb-page-section,
  .yb-learning-teacher__section.yb-page-section,
  .yb-learning-shared__section--related.yb-page-section {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-learning-common__lead,
  .yb-learning-context__lead,
  .yb-learning-curator__lead,
  .yb-learning-web__lead,
  .yb-learning-teacher__lead,
  .yb-learning-shared__pickup > p,
  .yb-learning-web__section-lead p,
  .yb-learning-teacher__license-lead p,
  .yb-learning-common__table-wrap,
  .yb-learning-context__subjects-wrap,
  .yb-learning-web__resource-list,
  .yb-learning-web__table-wrap,
  .yb-learning-teacher__resource-list,
  .yb-learning-teacher__table-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  .yb-learning-shared__pickup {
    padding: 0;
  }
  .yb-learning-shared__pickup-grid {
    gap: 32px;
  }
  .yb-learning-shared__related-list {
    gap: 24px;
  }
  .yb-learning-shared__related-list .yb-text-link--wide {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: anywhere;
  }
  .yb-subject-table {
    table-layout: fixed;
  }
  .yb-subject-table__group {
    width: 24px;
    min-width: 0;
    padding: 0 4px;
    font-size: 13px;
  }
  .yb-subject-table__category {
    width: 96px;
    min-width: 0;
  }
  .yb-subject-table__group,
  .yb-subject-table__category,
  .yb-subject-table__content {
    padding: 10px 8px;
    font-size: 13px;
    line-height: 1.6;
    overflow-wrap: anywhere;
    word-break: normal;
  }
  .yb-subject-table__group {
    padding: 0 4px;
  }
  .yb-license-table {
    table-layout: fixed;
  }
  .yb-license-table th,
  .yb-license-table td {
    width: auto !important;
    padding: 10px 8px;
    font-size: 13px;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .yb-learning-shared__resource {
    display: grid;
    gap: 16px;
    width: 100%;
    min-height: 0;
    padding: 16px;
    box-sizing: border-box;
  }
  .yb-learning-shared__resource-main,
  .yb-learning-shared__resource-buttons {
    width: 100%;
    min-width: 0;
  }
  .yb-learning-shared__resource-title {
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .yb-learning-shared__resource-title::before {
    top: 0.75em;
  }
  .yb-learning-shared__resource-note {
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .yb-learning-shared__resource-button {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    box-sizing: border-box;
  }
  .yb-learning-shared__resource-button span {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .yb-learning-teacher__hero-title {
    align-items: flex-start;
    min-width: 0;
    font-size: 22px;
    overflow-wrap: anywhere;
  }
  .yb-learning-teacher__hero-title::before {
    height: auto;
    min-height: 64px;
    align-self: stretch;
  }
  .yb-learning-web__resource-groups,
  .yb-learning-teacher__subsections,
  .yb-learning-teacher__subsection {
    width: 100%;
    min-width: 0;
  }
  .yb-learning-context__subjects-wrap {
    overflow: hidden;
  }
  .yb-subject-box-grid {
    grid-template-columns: 1fr;
  }
  .yb-subject-box--left,
  .yb-subject-box--right {
    background: linear-gradient(#33b3ed, #33b3ed) left top 8px/1px calc(100% - 16px) no-repeat, linear-gradient(#33b3ed, #33b3ed) right top 8px/1px calc(100% - 16px) no-repeat;
  }
  .yb-subject-box:nth-last-child(-n+2)::after {
    display: none;
  }
  .yb-subject-box:last-child::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 8px;
    right: 8px;
    display: block;
    height: 1px;
    background: #33b3ed;
  }
  .yb-contribute__lead,
  .yb-contribute__section-lead {
    width: 100%;
    max-width: 100%;
  }
  .yb-contribute-card-grid,
  .yb-contribute .yb-post-card-list {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .yb-contribute-card-grid .yb-post-card,
  .yb-contribute .yb-post-card-list .yb-post-card {
    padding-top: 0;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--yb-post-card-line);
  }
  .yb-contribute-card-grid .yb-post-card + .yb-post-card,
  .yb-contribute .yb-post-card-list .yb-post-card + .yb-post-card {
    padding-top: 32px;
  }
  .yb-contribute-card-grid .yb-post-card::before,
  .yb-contribute-card-grid .yb-post-card::after,
  .yb-contribute .yb-post-card-list .yb-post-card::before,
  .yb-contribute .yb-post-card-list .yb-post-card::after {
    display: none;
  }
  .yb-contribute .yb-post-card--horizontal a {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .yb-contribute-contact__body {
    padding: 32px 16px;
  }
  .yb-contribute-contact__mail,
  .yb-contribute-contact__downloads,
  .yb-contribute-contact__downloads .yb-file-button {
    width: 100%;
    max-width: 100%;
  }
  .yb-contribute-contact__tel {
    flex-wrap: wrap;
  }
  .yb-contribute-contact__mail,
  .yb-contribute-contact__downloads .yb-file-button {
    min-width: 0;
  }
  .yb-contribute-contact__mail span,
  .yb-contribute-contact__downloads .yb-file-button span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .yb-news-detail__inner {
    padding-right: 24px;
    padding-left: 24px;
  }
  .yb-news-detail__heading.yb-page-heading,
  .yb-news-detail__article-head {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-news-detail__article-head h2,
  .yb-news-detail__main-image,
  .yb-news-detail__slider,
  .yb-news-detail__sdgs,
  .yb-news-detail__content,
  .yb-news-detail__info,
  .yb-news-detail__footer {
    width: 100%;
    max-width: 100%;
  }
  .yb-news-detail__content,
  .yb-news-detail__content > *,
  .yb-news-detail__content > .wrap,
  .yb-news-detail__content > .wrap > *,
  .yb-news-detail__info,
  .yb-news-detail__footer {
    min-width: 0;
  }
  .yb-news-detail .yb-news-detail__content > *,
  .yb-news-detail .yb-news-detail__content > .wrap > * {
    width: 100%;
    max-width: 100%;
  }
  .yb-news-detail .yb-news-detail__content *,
  .yb-news-detail__info *,
  .yb-news-detail__footer * {
    box-sizing: border-box;
    max-width: 100%;
  }
  .yb-news-detail__content img,
  .yb-news-detail__content video,
  .yb-news-detail__content iframe,
  .yb-news-detail__content embed,
  .yb-news-detail__content object {
    max-width: 100%;
  }
  .yb-news-detail__content img,
  .yb-news-detail__content video {
    height: auto;
  }
  .yb-news-detail__content iframe,
  .yb-news-detail__content embed,
  .yb-news-detail__content object {
    display: block;
  }
  .yb-news-detail__content table,
  .yb-news-detail__table {
    max-width: 100%;
  }
  .yb-news-detail__content th,
  .yb-news-detail__content td,
  .yb-news-detail__table th,
  .yb-news-detail__table td,
  .yb-news-detail__content a {
    overflow-wrap: anywhere;
  }
  .yb-news-detail__content .wp-block-gallery,
  .yb-news-detail__content .gallery,
  .yb-news-detail__content .column2-float-01,
  .yb-news-detail__content .column2-flex-02,
  .yb-news-detail__content .column3-grid-01 {
    grid-template-columns: 1fr;
  }
  .yb-news-detail__content .link-square-01 a {
    min-width: 0;
    padding-right: 16px;
    padding-left: 44px;
  }
  .yb-news-detail__content .link-circle-01 a {
    max-width: 100%;
  }
  .yb-news-detail__content .link-square-01 a::before {
    left: 16px;
  }
  .yb-news-detail__content .link-square-01 a::after {
    position: static;
    margin-left: auto;
    transform: none;
  }
  .yb-news-detail__pager {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 8px;
  }
  .yb-news-detail__pager > div {
    justify-self: start;
  }
  .yb-news-detail__pager > div:last-child {
    justify-self: end;
  }
  .yb-news-detail__pager-link--return {
    justify-self: center;
  }
  .yb-news-detail__pager .yb-page-more-button {
    gap: 6px;
    min-height: 28px;
    padding: 6px 12px;
    font-size: 12px;
    letter-spacing: 0.04em;
  }
  .yb-news-card-grid {
    grid-template-columns: 1fr;
    gap: 0;
    padding-inline: 24px;
  }
  .yb-news-card-grid .yb-post-card {
    padding-top: 0;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--yb-post-card-line);
  }
  .yb-news-card-grid .yb-post-card + .yb-post-card {
    padding-top: 32px;
  }
  .yb-news-card-grid .yb-post-card::before,
  .yb-news-card-grid .yb-post-card::after {
    display: none;
  }
  .yb-primary-button {
    font-size: 16px;
  }
}
@media (max-width: 720px) {
  .yb-course-intro__heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
  }
  .yb-course-intro__heading h2 {
    order: 1;
  }
  .yb-course-intro__heading p {
    order: 2;
    max-width: 100%;
    line-height: 1.2;
  }
  .yb-course-intro__heading span {
    display: none;
  }
  .yb-course-intro__body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .yb-course-intro__body .yb-primary-button {
    min-width: 0;
    max-width: 100%;
  }
  .yb-course-detail::before,
  .yb-course-detail::after,
  .yb-course-detail__left-bg {
    display: none;
  }
  .yb-course-detail--paint::after {
    display: none;
  }
  .yb-course-detail--paint .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--paint .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/paint/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--paint .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--paint .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/paint/bg-left-outer.webp");
  }
  .yb-course-detail--paint .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/paint/bg-left-inner.webp");
  }
  .yb-course-detail--paint .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/paint/bg-left-front.webp");
  }
  .yb-course-detail--sculpture::after {
    display: none;
  }
  .yb-course-detail--sculpture .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--sculpture .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/sculpture/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--sculpture .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--sculpture .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/sculpture/bg-left-outer.webp");
  }
  .yb-course-detail--sculpture .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/sculpture/bg-left-inner.webp");
  }
  .yb-course-detail--sculpture .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/sculpture/bg-left-front.webp");
  }
  .yb-course-detail--craft::after {
    display: none;
  }
  .yb-course-detail--craft .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--craft .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/craft/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--craft .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--craft .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/craft/bg-left-outer.webp");
  }
  .yb-course-detail--craft .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/craft/bg-left-inner.webp");
  }
  .yb-course-detail--craft .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/craft/bg-left-front.webp");
  }
  .yb-course-detail--textile::after {
    display: none;
  }
  .yb-course-detail--textile .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--textile .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/textile/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--textile .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--textile .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/textile/bg-left-outer.webp");
  }
  .yb-course-detail--textile .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/textile/bg-left-inner.webp");
  }
  .yb-course-detail--textile .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/textile/bg-left-front.webp");
  }
  .yb-course-detail--product::after {
    display: none;
  }
  .yb-course-detail--product .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--product .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/product/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--product .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--product .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/product/bg-left-outer.webp");
  }
  .yb-course-detail--product .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/product/bg-left-inner.webp");
  }
  .yb-course-detail--product .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/product/bg-left-front.webp");
  }
  .yb-course-detail--vcd::after {
    display: none;
  }
  .yb-course-detail--vcd .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--vcd .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/vcd/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--vcd .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--vcd .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/vcd/bg-left-outer.webp");
  }
  .yb-course-detail--vcd .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/vcd/bg-left-inner.webp");
  }
  .yb-course-detail--vcd .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/vcd/bg-left-front.webp");
  }
  .yb-course-detail--anime::after {
    display: none;
  }
  .yb-course-detail--anime .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--anime .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/anime/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--anime .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--anime .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/anime/bg-left-outer.webp");
  }
  .yb-course-detail--anime .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/anime/bg-left-inner.webp");
  }
  .yb-course-detail--anime .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/anime/bg-left-front.webp");
  }
  .yb-course-detail--imd::after {
    display: none;
  }
  .yb-course-detail--imd .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--imd .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/imd/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--imd .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--imd .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/imd/bg-left-outer.webp");
  }
  .yb-course-detail--imd .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/imd/bg-left-inner.webp");
  }
  .yb-course-detail--imd .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/imd/bg-left-front.webp");
  }
  .yb-course-detail--illust::after {
    display: none;
  }
  .yb-course-detail--illust .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--illust .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/illust/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--illust .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--illust .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/illust/bg-left-outer.webp");
  }
  .yb-course-detail--illust .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/illust/bg-left-inner.webp");
  }
  .yb-course-detail--illust .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/illust/bg-left-front.webp");
  }
  .yb-course-detail--conserve::after {
    display: none;
  }
  .yb-course-detail--conserve .yb-course-detail__inner {
    --yb-course-mobile-inner-pad-top: 36px;
    --yb-course-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-course-detail--conserve .yb-course-detail__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-course-mobile-right-bg-h);
    margin-top: calc(var(--yb-course-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-course-mobile-inner-pad-top) - var(--yb-course-mobile-right-bg-h));
    background: url("../img/department/conserve/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail--conserve .yb-course-detail__content {
    position: relative;
    z-index: 1;
  }
  .yb-course-detail--conserve .yb-course-detail__mobile-bg-layer--outer {
    background-image: url("../img/department/conserve/bg-left-outer.webp");
  }
  .yb-course-detail--conserve .yb-course-detail__mobile-bg-layer--inner {
    background-image: url("../img/department/conserve/bg-left-inner.webp");
  }
  .yb-course-detail--conserve .yb-course-detail__mobile-bg-layer--front {
    background-image: url("../img/department/conserve/bg-left-front.webp");
  }
  .yb-course-detail__inner {
    box-sizing: border-box;
    padding-right: 0;
    padding-left: 0;
  }
  .yb-course-detail__content,
  .yb-course-detail__hero,
  .yb-course-detail__hero-card,
  .yb-course-detail__tags,
  .yb-course-detail__section,
  .yb-course-detail__interview {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-course-detail__content {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
    background: var(--yb-white);
    overflow: hidden;
  }
  .yb-course-detail__hero-card {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-course-detail__hero-card h1,
  .yb-course-detail__hero-card > p,
  .yb-course-detail__section-heading h2,
  .yb-course-detail__section-heading p,
  .yb-course-detail__tag-row h2,
  .yb-course-detail__tag-row p,
  .yb-course-detail__year-body h3,
  .yb-course-detail__year-body > p,
  .yb-course-detail__subject-list strong,
  .yb-course-detail__subject-list em,
  .yb-course-detail__pickup-body h4,
  .yb-course-detail__pickup-body p,
  .yb-course-detail__pickup-point li,
  .yb-course-detail__faculty-cards h3,
  .yb-course-detail__faculty-cards p,
  .yb-course-detail__blog-list h3,
  .yb-course-detail__blog-list p {
    overflow-wrap: anywhere;
  }
  .yb-course-detail__hero-card figure {
    width: 100%;
    height: auto;
    aspect-ratio: 624/240;
    margin-right: 0;
    margin-left: 0;
  }
  .yb-course-detail__hero-card img,
  .yb-course-detail__year-image img,
  .yb-course-detail__year-image video,
  .yb-course-detail__subject-list img,
  .yb-course-detail__pickup figure img,
  .yb-course-detail__faculty-cards img,
  .yb-course-detail__interview-photo,
  .yb-course-detail__blog-list img {
    max-width: 100%;
  }
  .yb-course-detail__side-title {
    display: none;
  }
  .yb-course-detail__tag-row {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 16px;
  }
  .yb-course-detail__tag-row p,
  .yb-course-detail__small-button {
    grid-column: 2;
  }
  .yb-course-detail__tag-row ul,
  .yb-course-detail__tag-row li {
    min-width: 0;
    max-width: 100%;
  }
  .yb-course-detail__tag-row li {
    justify-content: flex-start;
    line-height: 1.4;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  .yb-course-detail__small-button,
  .yb-course-detail__large-button {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    line-height: 1.4;
  }
  .yb-course-detail__small-button {
    width: fit-content;
  }
  .yb-course-detail__large-button {
    width: 100%;
  }
  .yb-course-detail__year,
  .yb-course-detail__year-image,
  .yb-course-detail__year-slides,
  .yb-course-detail__pickup,
  .yb-course-detail__pickup figure,
  .yb-course-detail__faculty-table,
  .yb-course-detail__virtual-frame {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-course-detail__year-image {
    height: auto;
    aspect-ratio: 528/379;
  }
  .yb-course-detail__year:first-of-type .yb-course-detail__year-image {
    height: auto;
    aspect-ratio: 528/220;
  }
  .yb-course-detail__year-slides,
  .yb-course-detail__year--connected .yb-course-detail__year-slides,
  .yb-course-detail__year:first-of-type .yb-course-detail__year-slides {
    height: 100%;
  }
  .yb-course-detail__year-controls {
    left: 12px;
    right: 12px;
    top: 50%;
    width: auto;
    transform: translateY(-50%);
  }
  .yb-course-detail__year-body {
    padding-right: 16px;
    padding-left: 16px;
  }
  .yb-course-detail__subject-list li {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 16px;
    padding: 12px;
  }
  .yb-course-detail__subject-list img {
    width: 96px;
    height: 72px;
  }
  .yb-course-detail__pickup {
    padding: 24px 16px;
  }
  .yb-course-detail__pickup figure {
    height: auto;
    aspect-ratio: 480/340;
  }
  .yb-course-detail__pickup-body,
  .yb-course-detail__pickup-point,
  .yb-course-detail__faculty-table > div:not(.yb-course-detail__faculty-table-body),
  .yb-course-detail__interview-list,
  .yb-course-detail__interview-list--single,
  .yb-course-detail__blog-list {
    grid-template-columns: 1fr;
  }
  .yb-course-detail__pickup-point {
    gap: 12px;
  }
  .yb-course-detail__pickup-point strong {
    min-width: 0;
    min-height: 48px;
  }
  .yb-course-detail__faculty-cards {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .yb-course-detail__faculty-cards img,
  .yb-course-detail__blog-list img {
    width: 100%;
    height: auto;
    aspect-ratio: 4/3;
  }
  .yb-course-detail__faculty-table-body {
    overflow-x: auto;
  }
  .yb-course-detail__faculty-table-body th,
  .yb-course-detail__faculty-table-body td {
    padding-right: 12px !important;
    padding-left: 12px !important;
    overflow-wrap: anywhere;
  }
  .yb-course-detail__interview {
    margin-top: 64px;
    padding: 48px 24px 64px;
  }
  .yb-course-detail__interview-list,
  .yb-course-detail__interview-list--single {
    justify-items: center;
    gap: 32px;
  }
  .yb-course-detail__interview-list li {
    width: min(100%, 248px);
    min-height: 0;
  }
  .yb-course-detail__blog-list {
    gap: 32px;
  }
  .yb-first-year::after,
  .yb-teacher-list::after {
    display: none;
  }
  .yb-first-year__inner {
    --yb-first-year-mobile-inner-pad-top: 36px;
    --yb-first-year-mobile-right-bg-h: 100vh;
    box-sizing: border-box;
    isolation: isolate;
    overflow: visible;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
  }
  .yb-first-year__inner::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-first-year-mobile-right-bg-h);
    margin-top: calc(var(--yb-first-year-mobile-inner-pad-top) * -1);
    margin-bottom: calc(var(--yb-first-year-mobile-inner-pad-top) - var(--yb-first-year-mobile-right-bg-h));
    background: url("../img/department/1st-specialized-subjects/right-img.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-first-year__content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    overflow: hidden;
  }
  .yb-first-year__intro,
  .yb-first-year__curriculum,
  .yb-first-year__diagram,
  .yb-first-year__subject {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .yb-first-year__intro {
    padding-right: 0;
    padding-left: 0;
  }
  .yb-first-year__subject-index,
  .yb-first-year__subject-index a,
  .yb-first-year__subject-index span {
    min-width: 0;
  }
  .yb-first-year__subject-index a {
    grid-template-columns: minmax(0, 1fr) 18px;
    gap: 13px;
  }
  .yb-first-year__subject-index a::after {
    grid-column: 2;
    grid-row: auto;
    align-self: center;
  }
  .yb-first-year__subject-index span {
    grid-column: 1;
  }
  .yb-first-year__subject-index i {
    white-space: normal;
  }
  .yb-first-year__section-heading p br {
    display: none;
  }
  .yb-first-year__diagram figure {
    padding-right: 16px;
    padding-left: 16px;
  }
  .yb-first-year__diagram img,
  .yb-first-year__subject-slides img,
  .yb-first-year__subject-list img {
    max-width: 100%;
  }
  .yb-first-year__diagram figcaption {
    padding: 24px 16px;
  }
  .yb-first-year__subject-slides {
    height: auto;
    aspect-ratio: 528/352;
  }
  .yb-first-year__subject-label {
    max-width: 100%;
    flex-wrap: wrap;
  }
  .yb-first-year__subject-controls {
    left: 12px;
    right: 12px;
    top: 50%;
    width: auto;
    transform: translateY(-50%);
  }
  .yb-first-year__subject-visual figcaption {
    padding-right: 16px;
    padding-left: 16px;
  }
  .yb-first-year__subject-body {
    padding-right: 16px;
    padding-left: 16px;
  }
  .yb-first-year__subject-body h3,
  .yb-first-year__subject-body > p,
  .yb-first-year__subject-list strong,
  .yb-first-year__subject-list em {
    overflow-wrap: anywhere;
  }
  .yb-first-year__subject-list li {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 16px;
    padding: 12px;
  }
  .yb-first-year__subject-list img {
    width: 96px;
    height: 72px;
  }
  .yb-teacher-list {
    --yb-teacher-list-mobile-pad-top: 36px;
    --yb-teacher-list-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-teacher-list::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-teacher-list-mobile-right-bg-h);
    margin-top: calc(var(--yb-teacher-list-mobile-pad-top) * -1);
    margin-bottom: calc(var(--yb-teacher-list-mobile-pad-top) - var(--yb-teacher-list-mobile-right-bg-h));
    background: url("../img/about/teacher_list/right-img.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-value-fixed-bg--index,
  .yb-value-page--index::after {
    display: none;
  }
  .yb-value-page--index {
    --yb-value-index-mobile-right-bg-h: 100vh;
    isolation: isolate;
    overflow: visible;
  }
  .yb-value-page--index::before {
    content: "";
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100%;
    height: var(--yb-value-index-mobile-right-bg-h);
    margin-bottom: calc(var(--yb-value-index-mobile-right-bg-h) * -1);
    background: url("../img/feature/index/bg-right.webp") left top/cover no-repeat;
    pointer-events: none;
  }
  .yb-value-page--index .yb-value-page__inner,
  .yb-value-page--index .yb-lower-nav {
    position: relative;
    z-index: 1;
  }
  .yb-value-page--index .yb-value-page__inner {
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
  }
  .yb-value-page--index .yb-value-heading,
  .yb-value-page--index .yb-value-section--links {
    padding-right: var(--yb-pad);
    padding-left: var(--yb-pad);
  }
  .yb-value-page--index .yb-value-section--links {
    margin-top: 40px;
    padding-top: 0;
  }
  .yb-value-page--index .yb-value-link-item a {
    grid-template-columns: 72px minmax(0, 1fr);
    column-gap: 20px;
  }
  .yb-value-page--index .yb-value-link-item__num {
    width: 72px;
    max-width: 100%;
  }
  .yb-value-page--index .yb-value-link-item__body {
    min-width: 0;
    min-height: 0;
  }
  .yb-value-page--index .yb-value-link-item__title h3 {
    line-height: 1.3;
  }
  .yb-value-page--index .yb-value-link-item__title h3,
  .yb-value-page--index .yb-value-link-item__description {
    overflow-wrap: anywhere;
  }
  .yb-value-page--index .yb-value-section--interview {
    width: calc(100% - 24px);
    margin: 48px 12px 0;
    padding: 48px 24px;
    gap: 32px;
  }
  .yb-value-page--index .yb-value-voice-card {
    width: min(100%, 328px);
    min-height: 0;
    margin-right: auto;
    margin-left: auto;
  }
  .yb-value-page--index .yb-value-voice-card a {
    width: 100%;
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 24px;
  }
  body:has(.yb-course-detail__left-bg) .yb-footer-nav,
  body:has(.yb-course-detail__left-bg) .yb-footer-cta,
  body:has(.yb-course-detail__left-bg) .yb-footer {
    z-index: 2;
  }
  .yb-mobile-left-visual {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 720/811;
    flex: 0 0 auto;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .yb-senpai-detail:not(.yb-senpai-detail--teacher) .yb-mobile-left-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../img/about/speciality/senpai/bg-left-front.svg") right top/cover no-repeat;
    pointer-events: none;
  }
  .yb-course-detail__mobile-visual {
    --yb-course-mobile-stage-w: 100vw;
    --yb-course-mobile-stage-inset: calc(var(--yb-course-mobile-stage-w) * 16 / 720);
    position: relative;
    z-index: 1;
    overflow: hidden;
  }
  .yb-course-detail__mobile-bg-stage {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .yb-course-detail__mobile-bg-layer {
    position: absolute;
    background-position: right top;
    background-repeat: no-repeat;
    pointer-events: none;
  }
  .yb-course-detail__mobile-bg-layer--outer,
  .yb-course-detail__mobile-bg-layer--front {
    inset: 0;
    background-size: 100% 100%;
  }
  .yb-course-detail__mobile-bg-layer--outer {
    z-index: 0;
  }
  .yb-course-detail__mobile-bg-layer--inner {
    z-index: 1;
    inset: 16px;
    background-position: right calc(var(--yb-course-mobile-stage-inset) - 16px) top calc(var(--yb-course-mobile-stage-inset) - 16px);
    background-size: calc(var(--yb-course-mobile-stage-w) * 648 / 720) auto;
  }
  .yb-course-detail__mobile-bg-layer--front {
    z-index: 2;
  }
  .yb-course-detail__left-title {
    position: absolute;
    left: 0;
    right: auto;
    top: 52px;
    z-index: 3;
    width: 100%;
    margin: 0;
    padding: 16px 52px;
    pointer-events: none;
  }
  .yb-course-detail:has(.yb-course-detail__left-bg) .yb-course-detail__left-title {
    width: 100%;
  }
}
@media (max-width: 540px) {
  .yb-language-en-top__fixed-bg {
    height: 62vw;
    min-height: 260px;
  }
  .yb-language-common-bg__image {
    width: max(100%, max(62vw, 260px) * 2880 / 1624);
  }
  .yb-language-common-bg__yokobi {
    height: min(92%, 232px);
  }
  .yb-language-en-top__heading h1 {
    font-size: 24px;
  }
  .yb-language-en-top__ja-name,
  .yb-language-en-top__lead,
  .yb-language-en-top__text,
  .yb-language-en-president__profile,
  .yb-language-en-president__bio,
  .yb-footer--english .yb-footer__address {
    font-size: 14px;
  }
  .yb-language-en-top__section-title {
    font-size: 20px;
  }
  .yb-language-en-top__small-title,
  .yb-language-en-menu-card h3 {
    font-size: 18px;
  }
  .yb-language-en-president__profile .yb-language-en-president__name {
    font-size: 16px;
  }
  .yb-language-en-menu {
    grid-template-columns: 1fr;
  }
  .yb-menu__language-list a,
  .yb-menu__language-pages a {
    min-height: 56px;
    font-size: 16px;
  }
  .yb-language-contact {
    gap: 56px;
  }
  .yb-language-contact-card {
    gap: 20px;
    padding: 24px;
  }
  .yb-language-contact-card__row {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
  }
  .yb-language-contact-card__row dt {
    min-height: 22px;
    font-size: 11px;
  }
  .yb-language-contact-card__row dd {
    font-size: 15px;
  }
  .yb-language-contact-card__row.is-strong dd {
    font-size: 25px;
  }
  .yb-language-page--policy .yb-language-contact-card__row {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 6px;
  }
  .yb-language-page--policy .yb-language-contact-card__row dt {
    width: 96px;
  }
  .yb-language-page--policy .yb-language-contact-card__row.is-strong dd {
    font-size: 23px;
    line-height: 1.15;
  }
  .yb-language-contact-card__button {
    min-height: 52px;
    padding: 0 24px;
    font-size: 16px;
  }
  .yb-footer--english .yb-footer__school-small {
    font-size: 14px;
  }
  .yb-footer--english .yb-footer__school-name {
    font-size: 24px;
  }
}
@media (max-width: 720px) {
  .yb-statement-vision {
    --yb-statement-panel-height: calc(100vw * 800 / 720);
    --yb-statement-scroll-distance: max(1280px, 180svh);
  }
  .yb-statement {
    background-image: url("../img/top/statement-bg-sp.webp");
  }
  .yb-statement__intro-base {
    width: 100%;
  }
  .yb-statement__concept-mark {
    right: 50%;
    width: 41.667%;
  }
  .yb-statement__content {
    width: 100%;
    min-height: 0;
  }
  .yb-statement__text {
    left: 26.098%;
    top: 22.5%;
    width: 47.804%;
    height: auto;
    aspect-ratio: 344.1904/378.1424;
  }
  .yb-statement__text-line--1 {
    width: 100%;
  }
  .yb-statement__text-line--2 {
    top: 15.805%;
    width: 81.472%;
  }
  .yb-statement__text-line--3 {
    top: 31.465%;
    width: 72.034%;
  }
  .yb-statement__text-line--4 {
    top: 57.464%;
    width: 90.109%;
  }
  .yb-statement__text-line--5 {
    top: 83.503%;
    width: 71.205%;
  }
  .yb-statement__art-crossing {
    left: 51.871%;
    top: 72.75%;
    width: 40.801%;
  }
}