@charset "utf-8";

.l-footer {
  background: white;
}
.l-footer__pagetop {
  display: none;
}
.l-footer__top {
  padding-top: 24px !important;
}
.p-culturedeck a:hover {
  opacity: unset;
}

.p-culturedeck {
  color: var(--blue);
  font-family: var(--fontJa);
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  --fontMin: .7rem;
  --fontBasis: 18;
  --aspect: 1280;
  --sidegap: min(var(--cw) * 115 / var(--aspect), 115px);
  --space: min(var(--cw) * 82 / var(--aspect), 80px);
}
.p-nav__item,
.p-culturedeck :where(h2,h3,h4,p,li,dt,dd,button) {
  font-weight: inherit;
  font-size: var(--fontSize);
  --fontSize: clamp(var(--fontMin), var(--cw) * var(--fontBasis) / var(--aspect), var(--fontBasis) * 1px);
  --imgSize: min(var(--cw) * var(--imgBasis) / var(--aspect), var(--imgBasis) * 1px);
}
.p-philosophy__image {
  --imgSize: min(var(--cw) * var(--imgBasis) / var(--aspect), var(--imgBasis) * 1px);
}
.p-culturedeck :where(img) {
  max-width: 100%;
  width: inherit;
  height: auto;
  pointer-events: none;
}
.p-culturedeck .serif {
  font-family: serif;
}
@media (max-width: 767.98px) {
  .p-culturedeck {
    --fontBasis: 16;
    --aspect: 430;
    --sidegap: min(var(--cw) * 40 / var(--aspect));
    --space: min(var(--cw) * 48 / var(--aspect));
  }
  .p-nav__item,
  .p-culturedeck :where(h2,h3,h4,p,li,dt,dd,button) {
    --fontSize: max(var(--cw) * var(--fontBasis) / var(--aspect), var(--fontMin));
    --imgSize: calc(var(--cw) * var(--imgBasis) / var(--aspect));
  }
  .p-philosophy__image {
    --imgSize: calc(var(--cw) * var(--imgBasis) / var(--aspect));
  }
}

.l-contents {
  display: grid;
  position: relative;
  place-items: center;
  min-height: 100dvh;
}

/**
 * ナビゲーション
 * ---------------------------------------- */
@media (min-width: 768px) {
  .p-nav {
    display: none;
  }
}
@media (max-width: 767.98px) {
  .p-nav {
    --progress: 0px;
    --progressSpace: min(var(--cw) * 40 / var(--aspect), 40px);
  }
  .p-nav__container {
    display: grid;
    justify-content: center;
    z-index: 3;
    position: fixed;
    inset: 0 0 0 auto;
    width: calc(var(--cw) * 319 / var(--aspect));
    overflow: auto;
    padding: calc(var(--cw) * 40 / var(--aspect)) 0;
    background: white;
    box-shadow: 0 -8px 24px #0004;
  }
  .p-nav__container a {
    display: block;
    color: var(--blue);
  }
  .p-nav__title {
    --fontBasis: 20;
    align-self: end;
  }
  .p-nav__list {
    align-self: start;
    display: grid;
    justify-content: center;
    row-gap: calc(var(--cw) * 24 / var(--aspect));
    position: relative;
    margin-top: calc(var(--cw) * 32 / var(--aspect));
    padding-left: var(--progressSpace);
  }
  .p-nav__item {
    --fontBasis: 13.67;
    font-size: var(--fontSize);
    line-height: 1.4;
  }
  .p-nav__item a > * {
    display: block;
  }
  .p-nav__item_subject {
    position: relative;
    font-weight: inherit;
    font-size: 190%;
  }
  .p-nav__item_subject::before {
    content: "";
    position: absolute;
    top: .75em;
    left: calc(var(--progressSpace) * -1);
    width: 16px;
    border-top: 2px solid currentcolor;
  }
  .p-nav__item_title {
    margin-top: .5em;
    font-size: 133%;
  }
  .p-nav__progress {
    position: absolute;
    top: calc(var(--cw) * 39 / var(--aspect));
    bottom: calc(var(--cw) * 69 / var(--aspect));
    left: 7px;
    border-left: 2px dotted currentcolor;
  }
  .p-nav__progress::after {
    content: "";
    position: absolute;
    top: -4px;
    left: -13px;
    width: 24px;
    height: 9px;
    background: var(--red);
    transform: translateY(var(--progress));
  }
  .p-nav__overlay {
    z-index: 3;
    position: fixed;
    inset: 0;
    background: #0001;
    backdrop-filter: blur(4px);
  }
  /* motion */
  .p-nav__container.is-open .p-nav__progress::after {
    transition: transform .8s var(--easeOut);
  }
  .p-nav:not(.is-active) {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
  .p-nav__list:not(.is-open),
  .p-nav__title:not(.is-open),
  .p-nav__overlay:not(.is-open) {
    opacity: 0;
  }
  .p-nav__title:not(.is-open),
  .p-nav__list:not(.is-open) {
    transform: translateX(24px);
  }
  .p-nav__container:not(.is-open) {
    transform: translateX(100%);
  }
  
  .p-nav__list.is-anim,
  .p-nav__title.is-anim {
    transition: opacity .2s, transform .2s;
  }
  .p-nav__overlay.is-anim {
    transition: opacity .2s .1s;
  }
  .p-nav__container.is-anim {
    transition: opacity .2s, transform .2s var(--easeOut);
  }
  
  .p-nav__overlay.is-anim.is-open {
    transition-delay: 0s;
  }
  .p-nav__container.is-anim.is-open {
    transition-duration: .4s;
    transition-timing-function :var(--easeInOut);
  }
  .p-nav__list.is-anim.is-open,
  .p-nav__title.is-anim.is-open {
    transition-duration: .4s;
    transition-delay: .3s;
  }
}

/**
 * ドロワー
 * ---------------------------------------- */
@media (min-width: 768px) {
  .p-drawer {
    display: none;
  }
}
@media (max-width: 767.98px) {
  .p-drawer {
    display: grid;
    place-items: center;
    z-index: 4;
    position: fixed;
    top: 24px;
    right: calc(var(--cw) * 24 / var(--aspect));
    width: 48px;
    height: 48px;
    font-weight: 500;
    line-height: 1.25;
    font-family: var(--fontEn);
    letter-spacing: .01em;
    text-transform: uppercase;
  }
  .l-contents .p-drawer {
    font-size: 11px;
  }
  .p-drawer > * {
    grid-area: 1 / 1;
    position: relative;
  }
  .p-drawer__bar {
    top: -8px;
    fill: none;
    stroke: currentcolor;
  }
  .p-drawer__bar:nth-child(1) {
    transform: translateY(-8px);
  }
  .p-drawer__bar:nth-child(3) {
    transform: translateY(8px);
  }
  .p-drawer__label {
    display: grid;
    place-items: center;
    top: 16px;
  }
  .p-drawer__label > * {
    grid-area: 1 / 1;
    clip-path: inset(0);
  }
  .p-drawer__label-close {
    clip-path: inset(0 0 100%);
  }
  .p-drawer {
    font-size: calc(var(--cw) * 11 / 375);
  }
  /* motion */
  .p-drawer.is-active .p-drawer__bar:nth-child(1) {
    transform: rotate(30deg);
  }
  .p-drawer.is-active .p-drawer__bar:nth-child(2) {
    transform: scaleX(0);
  }
  .p-drawer.is-active .p-drawer__bar:nth-child(3) {
    transform: rotate(-30deg);
  }
  .p-drawer.is-active .p-drawer__label-open {
    clip-path: inset(100% 0 0);
  }
  .p-drawer.is-active .p-drawer__label-close {
    clip-path: inset(0);
  }
  
  .p-drawer.is-anim .p-drawer__bar {
    animation: .3s var(--easeOut) both;
  }
  .p-drawer.is-anim .p-drawer__bar:nth-child(1) {
    animation-name: bar1Close;
  }
  .p-drawer.is-anim .p-drawer__bar:nth-child(2) {
    animation-name: bar2Close;
  }
  .p-drawer.is-anim .p-drawer__bar:nth-child(3) {
    animation-name: bar3Close;
  }
  .p-drawer.is-anim.is-active .p-drawer__bar {
    animation-duration: .6s;
    animation-timing-function: var(--easeBack);
  }
  .p-drawer.is-anim.is-active .p-drawer__bar:nth-child(1) {
    animation-name: bar1Open;
  }
  .p-drawer.is-anim.is-active .p-drawer__bar:nth-child(2) {
    animation-name: bar2Open;
  }
  .p-drawer.is-anim.is-active .p-drawer__bar:nth-child(3) {
    animation-name: bar3Open;
  }
  .p-drawer.is-anim .p-drawer__label-open,
  .p-drawer.is-anim .p-drawer__label-close {
    animation: .3s var(--easeOut) both;
  }
  .p-drawer.is-anim .p-drawer__label-close,
  .p-drawer.is-anim.is-active .p-drawer__label-open {
    animation-name: labelClose;
  }
  .p-drawer.is-anim .p-drawer__label-open,
  .p-drawer.is-anim.is-active .p-drawer__label-close {
    animation-name: labelOpen;
  }
  .p-drawer.is-anim.is-active .p-drawer__label-close,
  .p-drawer.is-anim.is-active .p-drawer__label-open {
    animation-duration: .6s;
  }
}
@keyframes bar1Open {
  from { transform: translateY(-8px); }
  32% { transform: none; }
  to { transform: rotate(30deg); }
}
@keyframes bar2Open {
  from, 25% { transform: none; }
  75%, to { transform: scaleX(0); }
}
@keyframes bar3Open {
  from { transform: translateY(8px); }
  32% { transform: none; }
  to { transform: rotate(-30deg); }
}
@keyframes bar1Close {
  from { transform: rotate(30deg); }
  50% { transform: none; }
  to { transform: translateY(-8px); }
}
@keyframes bar2Close {
  from { transform: scaleX(0); }
  to { transform: none; }
}
@keyframes bar3Close {
  from { transform: rotate(-30deg); }
  50% { transform: none; }
  to { transform: translateY(8px); }
}
@keyframes labelOpen {
  from { clip-path: inset(0 0 100%); }
  to { clip-path: inset(0); }
}
@keyframes labelClose {
  from { clip-path: inset(0); }
  to { clip-path: inset(100% 0 0); }
}

/**
 * アンカーリンク
 * ---------------------------------------- */
.p-anchorlink {
  --progress: 0px;
  z-index: 2;
  position: fixed;
  right: 0;
  bottom: var(--space);
}
.p-anchorlink {
  transition: opacity .3s, translate .3s var(--easeInOut);
}
.p-anchorlink.is-appear {
  transition-duration: 0s, .6s;
  transition-timing-function: var(--easeOut);
}
.p-anchorlink:not(.is-appear) {
  opacity: 0;
  translate: 100% 0;
}
.p-anchorlink.is-release {
  position: absolute;
}
.p-anchorlink__list {
  display: grid;
}
.p-anchorlink__item {
  --fontBasis: 16.86;
  line-height: 1.2;
}
.p-anchorlink__item span {
  transform-origin: left center;
  transform: scale(.8);
}
.p-anchorlink__item a {
  display: grid;
}
@media (min-width: 768px) {
  .p-anchorlink {
    filter: drop-shadow(0 4px 16px #0038622d);
  }
  .p-anchorlink__list {
    row-gap: 8px;
  }
  .p-anchorlink__item a {
    place-items: center start;
    height: min(var(--cw) * 32 / var(--aspect), 32px);
    padding: 0 .75em;
    color: var(--blue);
    background: white;
  }
  @media (hover) {
    .p-anchorlink__item a:hover {
      background: #c0d8e9;
      transition-duration: .1s;
    }
  }
  .p-anchorlink__progress {
    position: absolute;
    inset: min(var(--cw) * 16 / var(--aspect), 16px) 100% min(var(--cw) * 16 / var(--aspect), 16px) auto;
    width: 16px;
  }
  .p-anchorlink__progress::after {
    content: "";
    position: absolute;
    top: -10px;
    width: 14px;
    height: 20px;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    background: var(--red);
  }
  /* motion */
  .p-anchorlink__item a {
    transition: color .6s var(--easeOut), background-color .6s var(--easeOut);
  }
  .p-anchorlink__item span {
    transition: transform .4s var(--easeOut);
  }
  .p-anchorlink__item.is-active a {
    color: white;
    background: var(--blue);
  }
  .p-anchorlink__item.is-active span {
    transform: none;
  }
  .p-anchorlink__progress::after {
    transform: translateY(var(--progress));
    transition: transform .8s var(--easeOut);
  }
}
@media (max-width: 767.98px) {
  .p-anchorlink {
    bottom: 0;
    padding: 1em 0 3em;
    background: var(--blue);
  }
  .p-anchorlink.is-release {
    bottom: 0;
  }
  .p-anchorlink__list {
    row-gap: 2em;
    background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="1" height="6" viewBox="0 0 1 6" style="fill:none;stroke:white;stroke-dasharray:1 2;stroke-linecap:round;stroke-linejoin:round"><path d="M.5.5v5"/></svg>') center top / 1px 6px repeat-y;
  }
  .p-anchorlink__item {
    --fontBasis: 15;
    display: grid;
    line-height: 0;
  }
  .p-anchorlink__item a {
    pointer-events: none;
    place-items: center;
    position: relative;
    overflow: hidden;
    width: calc(var(--sidegap) * .7);
    height: 5em;
    padding-top: .6em;
    color: white;
    white-space: nowrap;
    writing-mode: vertical-rl;
    background: var(--blue);
    opacity: 1 !important;
  }
  .p-anchorlink__item:nth-child(3) a {
    height: 5.8em;
  }
  .p-anchorlink__item:nth-child(4) a {
    height: 8em;
  }
  .p-anchorlink__item a::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: .2em;
    width: .75em;
    margin: .4em auto;
    background: var(--red);
  }
  /* motion */
  .p-anchorlink__item a {
    transition: height .6s var(--easeInOut), color .6s;
    will-change: height;
    backface-visibility: hidden;
  }
  .p-anchorlink__item::before {
    transition: background .4s, scale .4s var(--easeOut);
  }
  .p-anchorlink__item:not(.is-active) a {
    height: 1em;
    color: #fff0;
    transition-duration: .4s;
    transition-timing-function: var(--easeOut);
  }
  .p-anchorlink__item:not(.is-active) a::before {
    scale: .8;
    background: white;
  }
}

/**
 * ファーストビュー
 * ---------------------------------------- */
.p-covervisual {
  display: grid;
  place-items: center;
  overflow: hidden;
  /* position: absolute; */
  inset: 0 0 auto;
  width: 100%;
}
.p-covervisual > * {
  grid-area: 1 / 1;
}

/* :::::: PERSOL CULTURE DECK :::::: */
.p-covervisual__title {
  z-index: 1;
  display: grid;
  justify-items: center;
  /* font: 500 calc(var(--cw) * 68 / var(--aspect)) / 1.25 var(--fontEn); */
  white-space: nowrap;
  text-align: center;
}
/* .p-covervisual__title span {
  padding-left: .16em;
  color: white;
  letter-spacing: .19em;
  background: var(--blue);
  mask: linear-gradient(to top, #0000 22.5%, #000 22.5%, #000 95%, #0000 95%);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
} */
@media (min-width: 768px) {
  .p-covervisual__title .u-pconly {
    width: calc(100vw * 721 / 1280);
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__title {
    /* font-size: calc(var(--cw) * 51 / var(--aspect)); */
  }
  .p-covervisual__title .u-sponly {
    width: calc(100vw * 332 / 430);
  }
}

/* :::::: ビジュアル :::::: */
.p-covervisual__image {
  display: grid;
  width: 100%;
}
.p-covervisual__image > * {
  grid-area: 1 / 1;
}
.p-covervisual__image * {
  width: 100%;
  height: 100dvh;
}
.p-covervisual__image-left {
  justify-self: start;
}
.p-covervisual__image-right {
  justify-self: end;
}
.p-covervisual__image img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .p-covervisual__image-left,
  .p-covervisual__image-right {
    width: calc(var(--cw) * 485 / var(--aspect));
    height: auto;
  }
  .p-covervisual__image-left img[height="1440"] {
    object-position: right center;
  }
  .p-covervisual__image-right img[height="1440"] {
    object-position: left center;
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__image-left,
  .p-covervisual__image-right {
    display: grid;
  }
  .p-covervisual__image-left {
    justify-items: start;
  }
  .p-covervisual__image-right {
    justify-items: end;
  }
  .p-covervisual__image-left img,
  .p-covervisual__image-right img {
    height: auto;
  }
  .p-covervisual__image-left [src*="img_01_tree1_top"] {
    align-self: start;
    width: calc(var(--cw) * 286 / var(--aspect));
  }
  .p-covervisual__image-left [src*="img_01_tree1_btm"] {
    align-self: end;
    width: calc(var(--cw) * 427 / var(--aspect));
  }
  .p-covervisual__image-right [src*="img_01_tree2_top"] {
    align-self: start;
    width: calc(var(--cw) * 252 / var(--aspect));
  }
  .p-covervisual__image-right [src*="img_01_tree2_btm"] {
    align-self: end;
    width: calc(var(--cw) * 377 / var(--aspect));
  }
}

/* :::::: PERSOL Logo :::::: */
.p-covervisual .p-logo {
  --line: calc(var(--cw) * 1 / var(--aspect));
  --space: calc(var(--cw) * 16 / var(--aspect));
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  padding: var(--space);
}
.p-covervisual .p-logo::after {
  content: "";
  position: absolute;
  background: url(../images/logo_mask.webp) center / cover no-repeat;
}
.p-covervisual .p-logo__box {
  display: grid;
  place-items: center;
  width: calc(var(--cw) * 103 / var(--aspect));
  height: calc(var(--cw) * 108 / var(--aspect));
}
.p-covervisual .p-logo img {
  position: relative;
  width: calc(var(--cw) * 49 / var(--aspect));
  height: auto;
}
.p-covervisual .p-logo__box::before {
  content: "";
  position: absolute;
  inset: var(--space);
  width: inherit;
  height: inherit;
  border: calc(var(--cw) * 2 / var(--aspect)) solid var(--blue);
  box-shadow: inset 0 0 0 calc(var(--line) * 1.5) white, inset 0 0 0 calc(var(--line) * 2.5) currentcolor;
  background: white;
}
@media (min-width: 768px) {
  .p-covervisual .p-logo::after {
    inset: 0;
  }
}
@media (max-width: 767.98px) {
  .p-covervisual .p-logo {
    --line: min(var(--cw) * 1 / var(--aspect), 1px);
    --space: calc(var(--cw) * 16 / var(--aspect));
    top: calc(var(--space) * 2.5);
  }
  .p-covervisual .p-logo__box {
    width: calc(var(--cw) * 96 / var(--aspect));
    height: calc(var(--cw) * 96 / var(--aspect));
  }
  .p-covervisual .p-logo img {
    width: calc(var(--cw) * 49.92 / var(--aspect));
  }
  .p-covervisual .p-logo::after {
    top: calc(var(--cw) * -40 / var(--aspect));
    left: 0;
    width: calc(var(--cw) * 100 / var(--aspect));
    height: calc(var(--cw) * 100 / var(--aspect));
    background-image: url(../images/logo_mask_sp.webp);
  }
}

/* :::::: スクロール :::::: */
.p-covervisual__scroll {
  display: grid;
  justify-items: center;
  row-gap: .5em;
  z-index: 2;
  position: fixed;
  inset: auto 0 0;
  width: fit-content;
  margin: 2em auto;
  color: var(--red);
  font: 500 calc(var(--cw) * 16 / var(--aspect)) / 1.25 var(--font);
  line-height: 1;
  letter-spacing: .17em;
  fill: currentcolor;
  text-transform: uppercase;
  transform-origin: center bottom;
}
.p-covervisual__scroll span {
  display: block;
  padding: .2em .02em 0 .14em;
  background: white;
}
.p-covervisual__scroll svg {
  width: calc(var(--cw) * 112 / var(--aspect));
}
.p-covervisual__scroll.is-hide {
  pointer-events: none;
}
@media (hover) {
  .p-covervisual__scroll {
    cursor: pointer;
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__scroll {
    margin: 1em auto;
  }
}

/* :::::: コンセプト :::::: */
.p-covervisual__concept {
  z-index: 1;
  display: grid;
  row-gap: 1em;
  padding: 2em 2em 2.5em;
  text-align: center;
  background: white;
  opacity: 0;
}
.p-covervisual__concept p {
  font-size: min(var(--cw) * 18 / var(--aspect), 1.8rem);
  line-height: 1.75;
}
@media (min-width: 768px) {
  .p-covervisual__concept {
    width: min(var(--cw) * 645 / var(--aspect), 645px);
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__concept {
    display: grid;
    place-items: center;
    align-content: center;
    row-gap: 1.5em;
    padding: 4em 1em;
    width: calc(100% - var(--sidegap) * 1.6);
    margin-bottom: 4em;
    max-height: 666px;
  }
  .p-covervisual__concept p {
    font-size: calc(var(--cw) * 15 / var(--aspect));
    line-height: 2;
  }
}

/* :::::: 目次 :::::: */
.p-covervisual__index {
  display: grid;
  z-index: 1;
  position: relative;
  width: 100%;
}
.p-covervisual__index:not(.is-active) {
  pointer-events: none;
}
.p-covervisual__index_label {
  --fontBasis: 35.4;
  place-self: start;
  position: relative;
  font: 500 calc(var(--cw) * 35.4 / var(--aspect)) / 1.25 var(--fontEn);
  line-height: 1.25;
  letter-spacing: .19em;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .p-covervisual__index {
    height: 100dvh;
    background: white;
  }
  .p-covervisual__index > * {
    grid-area: 1 / 1;
  }
  .p-covervisual__index_label {
    top: calc(var(--cw) * 40 / var(--aspect));
    left: calc(var(--cw) * 54 / var(--aspect));
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__index {
    justify-items: center;
    padding-block: calc(var(--cw) * 64 / var(--aspect));
  }
  .p-covervisual__index_label {
    left: calc(var(--cw) * 48 / var(--aspect));
    font-size: calc(var(--cw) * 16 / var(--aspect));
  }
  .p-covervisual__index_label span {
    padding: .2em 0 0 .16em;
    letter-spacing: .19em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }
}
/* 一覧 */
.p-covervisual__index_item {
  color: currentcolor;
  font-size: calc(var(--cw) * 19 / var(--aspect));
  line-height: 1;
}
.p-covervisual__index_item a {
  display: grid;
  justify-items: start;
  row-gap: .1em;
}
.p-covervisual__index_num {
  color: var(--blue);
}
.p-covervisual__index_subject,
.p-covervisual__index_title,
.p-covervisual__index_lead {
  padding: 0 .14em .135em .14em;
  color: white;
  background: var(--blue);
}
.p-covervisual__index_subject {
  position: relative;
  font-weight: inherit;
  font-size: 190.3%;
}
.p-covervisual__index_title {
  margin-top: .28em;
  padding-block: .07em .205em;
  font-size: 115.8%;
}
.p-covervisual__index_lead {
  font-size: 84.21%;
  padding-block: .06em .195em;
}
@media (min-width: 768px) {
  .p-covervisual__index_item {
    position: absolute;
  }
  .p-covervisual__index_item:nth-child(1) { top: 64%;   left: 9.4%; }
  .p-covervisual__index_item:nth-child(2) { top: 41.4%; left: 16.8%; }
  .p-covervisual__index_item:nth-child(3) { top: 22.3%; left: 42%; }
  .p-covervisual__index_item:nth-child(4) { top: 7.1%;  left: 64.2%; }
  .p-covervisual__index_subject::before,
  .p-covervisual__index_subject::after {
    content: "";
    position: absolute;
    pointer-events: none;
  }
  .p-covervisual__index_subject::before {
    left: 100%;
    top: .58em;
    width: calc(var(--w) * .3vw);
    height: calc(var(--h) * .5vh);
    border-top: 2px solid var(--red);
    border-right: 2px solid var(--red);
  }
  .p-covervisual__index_subject::after {
    right: calc(var(--w) * -.3vw - .15em + 1px);
    bottom: calc(var(--h) * -.5vh + .4em);
    width: .3em;
    height: .3em;
    border: 2px solid var(--red);
    border-radius: .3em;
    background: white;
  }
  .p-covervisual__index_item:nth-child(1) { --w: 40; --h: 42.5; }
  .p-covervisual__index_item:nth-child(2) { --w: 32; --h: 41; }
  .p-covervisual__index_item:nth-child(3) { --w: 30.5; --h: 15; }
  .p-covervisual__index_item:nth-child(4) { --w: 22; --h: 58; }
}
@media (max-width: 767.98px) {
  .p-covervisual__index_list {
    position: relative;
    left: -1.2em;
    margin-top: .5em;
  }
  .p-covervisual__index_item {
    font-size: calc(var(--cw) * 16 / var(--aspect));
  }
  .p-covervisual__index_item:nth-child(n+2) {
    margin-top: 1em;
  }
  .p-covervisual__index_subject {
    font-size: 150%;
  }
  .p-covervisual__index_lead {
    font-size: 87.5%;
  }
}
/* 山脈 */
.p-covervisual__index_image {
  z-index: -1;
  display: grid;
}
.p-covervisual__index_image > * {
  grid-area: 1 / 1;
  width: 100%;
  height: inherit;
}
.p-covervisual__index_image img {
  object-fit: cover;
}
@media (min-width: 768px) {
  .p-covervisual__index_image,
  .p-covervisual__index_image img {
    height: inherit;
  }
  .p-covervisual__index_image::before,
  .p-covervisual__index_image::after {
    content: "";
    z-index: 1;
    position: absolute;
    pointer-events: none;
  }
  .p-covervisual__index_image::before {
    inset: 10px;
    border: 4px solid currentcolor;
  }
  .p-covervisual__index_image::after {
    inset: 17px;
    border: 1px solid currentcolor;
  }
  .p-covervisual__frame {
    display: none;
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__index_image {
    position: relative;
    padding-top: calc(var(--cw) * 24 / var(--aspect));
  }
  .p-covervisual__index_image .p-covervisual__index_num {
    display: grid;
    place-items: center;
    position: absolute;
    width: 2.6em;
    height: 2.6em;
    padding-bottom: .1em;
    border: 1px solid currentcolor;
    border-radius: 2.6em;
    font-size: calc(var(--cw) * 12 / var(--aspect));
    line-height: 1;
    background: white;
  }
  .p-covervisual__index_image .p-covervisual__index_num:nth-of-type(1) {
    --h: 96;
    top: 9%;
    left: 12%;
  }
  .p-covervisual__index_image .p-covervisual__index_num:nth-of-type(2) {
    --h: 80;
    top: 0;
    left: 36%;
  }
  .p-covervisual__index_image .p-covervisual__index_num:nth-of-type(3) {
    --h: 24;
    top: -18%;
    left: 63%;
  }
  .p-covervisual__index_image .p-covervisual__index_num:nth-of-type(4) {
    --h: 64;
    top: -24%;
    left: 80%;
  }
  .p-covervisual__index_image .p-covervisual__index_num::before,
  .p-covervisual__index_image .p-covervisual__index_num::after {
    content: "";
    position: absolute;
    pointer-events: none;
  }
  .p-covervisual__index_image .p-covervisual__index_num::before {
    left: calc(50% - .5px);
    top: 100%;
    height: calc(var(--cw) * var(--h) / var(--aspect));
    border-left: 1px solid var(--red);
  }
  .p-covervisual__index_image .p-covervisual__index_num::after {
    right: calc(50% - .25em);
    bottom: calc(var(--cw) * var(--h) / var(--aspect) * -1);
    width: .5em;
    height: .5em;
    border: 1px solid var(--red);
    border-radius: .3em;
    background: white;
  }
  .p-covervisual__index .pin-spacer {
    pointer-events: none;
  }
  .p-covervisual__frame {
    pointer-events: none;
    z-index: 1;
    position: absolute;
    inset: 0;
    width: 100%;
    /* height: 100lvh; */
    backface-visibility: hidden;
  }
  /* MEMO: Safari で border-image と position:fixed の相性が悪いので border-image は擬似要素で表示 */
  .p-covervisual__frame::after {
    content: "";
    position: absolute;
    inset: 0;
    border-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" viewBox="0 0 500 500" fill="none" stroke="%23094f83"><path d="M451.431,10H48.586L10,48.586v407.727l38.509,33.687h402.953l38.538-36.599V48.586l-38.569-38.586ZM483.678,451.709l-34.062,32.051H52.4l-36.079-31.161V52.5L52.4,16.431h396.256l35.022,35.028v400.249Z" fill="white" stroke-width="0"/><path d="M490,48.586v404.815l-38.538,36.599H48.509l-38.509-33.687V48.586L48.586,10h402.845l38.569,38.586Z" stroke-width="4"/><path d="M483.678,451.709l-34.062,32.051H52.4l-36.079-31.161V52.5L52.4,16.431h396.256l35.022,35.028v400.249Z"/></svg>') 100 / 100px;
  }
  .p-covervisual__index::before {
    --chamfer: 40px;
    content: "";
    z-index: -1;
    position: absolute;
    inset: calc(var(--cw) * 10 / var(--aspect));
    background: white;
    clip-path: polygon(
      0 var(--chamfer), var(--chamfer) 0, calc(100% - var(--chamfer)) 0, 100% var(--chamfer),
      100% calc(100% - var(--chamfer)), calc(100% - var(--chamfer)) 100%, var(--chamfer) 100%, 0 calc(100% - var(--chamfer))
    );
  }
}
/* CULTURE DECK とは？ */
.p-covervisual__index_summary {
  place-self: end;
  padding: 1.4em 1.5em 1.8em 2em;
  border: 1px solid currentcolor;
  font-size: calc(var(--cw) * 14 / var(--aspect));
  line-height: 1.5;
  background: white;
}
.p-covervisual__index_summary dt {
  width: fit-content;
  padding-bottom: .1em;
  font-size: calc(var(--cw) * 15.94 / var(--aspect));
  border-bottom: 1px dashed currentcolor;
}
.p-covervisual__index_summary dd {
  margin-top: .75em;
  font-size: calc(var(--cw) * 13 / var(--aspect));
  line-height: 1.8;
}
@media (min-width: 768px) {
  .p-covervisual__index_summary {
    margin: calc(var(--cw) * 40 / var(--aspect));
  }
}
@media (max-width: 767.98px) {
  .p-covervisual__index_summary {
    width: 74%;
    margin: calc(var(--cw) * 40 / var(--aspect)) auto 0;
  }
}

/* :::::: イントロモーション :::::: */
.js-spacer {
  width: 100%;
  height: 200vh;
}
@media (min-width: 768px) {
  .p-covervisual,
  .p-covervisual__index {
    position: fixed;
    inset: 0;
  }
}
@media (max-width: 767.98px) {
  .js-spacer {
    height: 200vh;
  }
  .p-covervisual {
    position: fixed;
    inset: 0;
  }
}
/* タイトルとコンセプト入れ替え */
.p-covervisual .p-covervisual__title,
.p-covervisual .p-covervisual__concept {
  transition: opacity .6s;
}
.p-covervisual__title.is-hide {
  opacity: 0;
}
.p-covervisual__concept.is-active {
  opacity: 1;
}
/* 木々が左右にはけてロゴが消える */
.p-covervisual .p-logo {
  transition: opacity .6s, translate .8s var(--easeOut);
}
.p-covervisual__image {
  transition: opacity .6s;
}
.p-covervisual .p-covervisual__image-left,
.p-covervisual .p-covervisual__image-right {
  transition: translate .8s var(--easeOut);
}
.p-covervisual .p-logo.is-hide,
.p-covervisual__image.is-hide {
  opacity: 0;
}
.p-covervisual .p-logo.is-hide,
.p-covervisual__image.is-active .p-covervisual__image-left {
  translate: -12vh;
}
.p-covervisual__image.is-active .p-covervisual__image-right {
  translate: 12vh;
}
/* インデックスフェードイン */
.p-covervisual__index {
  transition: opacity .6s;
}
.p-covervisual__index:not(.is-active) {
  opacity: 0;
}
/* 一覧が順にフェードイン */
@media (min-width: 768px) {
  .p-covervisual__index_list li {
    transition: opacity .8s, translate .8s .6s var(--easeOut);
  }
  .p-covervisual__index_list:not(.is-active) li {
    opacity: 0;
    translate: 0 40px;
    transition-duration: .6s, 0s;
    transition-timing-function: var(--easeOut);
  }
  .p-covervisual__index_list.is-active li:nth-child(1) {
    transition-delay: .1s;
  }
  .p-covervisual__index_list.is-active li:nth-child(2) {
    transition-delay: .15s;
  }
  .p-covervisual__index_list.is-active li:nth-child(3) {
    transition-delay: .2s;
  }
  .p-covervisual__index_list.is-active li:nth-child(4) {
    transition-delay: .25s;
  }
}
/* スマホ版は番号が順にフェードイン */
@media (max-width: 767.98px) {
  .p-covervisual__index_num {
    transition: opacity .6s, translate .6s .4s var(--easeOut);
  }
  .p-covervisual__index_num:not(.is-active) {
    opacity: 0;
    translate: 0 24px;
    transition-duration: .4s 0s;
    transition-timing-function: var(--easeOut);
  }
  .p-covervisual__index_num:nth-of-type(1).is-active {
    transition-delay: .1s;
  }
  .p-covervisual__index_num:nth-of-type(2).is-active {
    transition-delay: .2s;
  }
  .p-covervisual__index_num:nth-of-type(3).is-active {
    transition-delay: .3s;
  }
  .p-covervisual__index_num:nth-of-type(4).is-active {
    transition-delay: .4s;
  }
}
/* 山脈が競り上がる */
.p-covervisual__index_image-back {
  translate: 0 10%;
}
.p-covervisual__index_image-front {
  translate: 0 40%;
}
.p-covervisual__index_image-back,
.p-covervisual__index_image-front {
  transition: opacity .6s, translate .8s var(--easeOut);
}
.p-covervisual__index_image-back.is-active,
.p-covervisual__index_image-front.is-active {
  opacity: 1;
  translate: 0;
}
.p-covervisual__index_image-back:not(.is-active),
.p-covervisual__index_image-front:not(.is-active) {
  transition-duration: 0s;
  transition-delay: .6s;
}
.p-covervisual__index_image-front.is-active {
  transition-duration: .8s;
}
/* コンセプト */
.p-covervisual__index_summary {
  transition: opacity .6s, translate .8s var(--easeOut);
}
.p-covervisual__index_summary:not(.is-active) {
  opacity: 0;
  translate: 0 10vh;
  transition-duration: 0s;
  transition-delay: .6s;
}
/* スクロール縮小 */
.p-covervisual__scroll {
  transition: opacity .6s, scale .6s var(--easeOut);
}
.p-covervisual__scroll.is-small {
  scale: .75;
}
.p-covervisual__scroll.is-hide {
  opacity: 0;
}
/* ヘッダータイトル表示 */
.p-drawer {
  transition: opacity .2s;
}
.p-title {
  transition: opacity .2s;
}
.p-drawer.is-hide,
.p-title:not(.is-active) {
  opacity: 0;
  pointer-events: none;
}
.p-drawer:not(.is-hide),
.p-title.is-active {
  transition-duration: .4s;
  transition-delay: .6s;
}

/**
 * インターリュード
 * ---------------------------------------- */
.c-interlude {
  display: grid;
  overflow: hidden;
  z-index: -1;
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  /* padding-bottom: 80px; */
  pointer-events: none;
}
.c-interlude * {
  align-items: end;
  width: inherit;
  height: inherit;
}
.c-interlude > * {
  grid-area: 1 / 1;
}
.c-interlude__left {
  justify-self: start;
  width: calc(var(--cw) * 427 / var(--aspect));
}
.c-interlude__right {
  justify-self: end;
  width: calc(var(--cw) * 458 / var(--aspect));
}
.c-interlude__left,
.c-interlude__right {
  align-self: end;
  height: auto;
}
.c-interlude img {
  width: inherit;
  height: inherit;
  object-fit: cover;
  object-position: center bottom;
}
.c-interlude__left img {
  height: auto;
  object-position: right bottom;
}
.c-interlude__right img {
  height: auto;
  object-position: left bottom;
}
@media (min-width: 768px) {
}
@media (max-width: 767.98px) {
  .c-interlude * {
    height: auto;
  }
  .c-interlude__left,
  .c-interlude__right,
  .c-interlude__front {
    align-self: end;
  }
  .c-interlude__left {
    width: calc(var(--cw) * 212 / var(--aspect));
  }
  .c-interlude__right {
    width: calc(var(--cw) * 170 / var(--aspect));
  }
  .c-interlude img {
    object-position: center center;
  }
  .c-interlude__left img {
    object-position: right center;
  }
  .c-interlude__right img {
    object-position: left center;
  }
}

.p-title {
  z-index: 2;
  position: fixed;
  top: 24px;
  left: calc(var(--cw) * 32 / var(--aspect));
  font: 500 1.554rem / 1 var(--fontEn);
}
.p-title button {
  display: grid;
  justify-items: start;
  letter-spacing: .19em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.p-title span {
  padding: .2em 0 0 .16em;
  color: white;
  background: var(--blue);
  mask: linear-gradient(to top, #0000 10%, #000 10%, #000 92%, #0000 92%)
}
@media (hover) {
  .p-title button {
    cursor: pointer;
  }
}
@media (max-width: 767.98px) {
  .l-contents .p-title {
    top: 32px;
    left: calc(var(--cw) * 24 / var(--aspect));
    font-size: 15.54px
  }
}

/* :::::: 入れ替えモーション :::::: */
.c-interlude {
  transition: opacity .6s;
}
.l-contents .c-interlude__front,
.l-contents .c-interlude__left,
.l-contents .c-interlude__right {
  transition: opacity .6s .2s, translate .8s .3s var(--easeOut);
}
.l-contents:not([data-chapter="1"]) .p-interlude1,
.l-contents:not([data-chapter="2"]) .p-interlude2,
.l-contents:not([data-chapter="3"]) .p-interlude3,
.l-contents:not([data-chapter="4"]) .p-interlude4 {
  opacity: 0;
}
.l-contents[data-chapter="2"] .p-interlude2 .c-interlude__left {
  translate: -6.4vw 0;
}
.l-contents[data-chapter="2"] .p-interlude2 .c-interlude__right {
  translate: 6.4vw 0;
}
.l-contents:not([data-chapter="2"]) .p-interlude2 .c-interlude__left,
.l-contents:not([data-chapter="2"]) .p-interlude2 .c-interlude__right {
  transition-duration: 0s;
  transition-delay: .6s;
}
.l-contents:not([data-chapter="3"]) .p-interlude3 .c-interlude__front,
.l-contents:not([data-chapter="4"]) .p-interlude4 .c-interlude__front {
  opacity: 0;
  translate: 0 20vh;
  transition-duration: 0s;
  transition-delay: .6s;
}

/**
 * チャプター
 * ---------------------------------------- */
.c-chapter {
  --stickout: min(var(--cw) * 48 / var(--aspect), 48px);
  width: min(var(--cw) * 960 / var(--aspect), 960px);
  padding-top: calc(100vh - var(--stickout));
  padding-bottom: var(--space);
}
.c-chapter-wrap {
  position: relative;
  padding: var(--space) var(--sidegap) 0;
  background: linear-gradient(to top, #fff0 calc(var(--space) + 2px), white calc(var(--space) + 2px));
}
@media (min-width: 768px) {
  .c-chapter-wrap {
    padding: var(--space) var(--sidegap) 0;
  }
}
@media (max-width: 767.98px) {
  .c-chapter {
    --stickout: calc(var(--cw) * 248 / var(--aspect));
    display: grid;
    width: calc(100% - var(--sidegap) * 1.4);
  }
  .is-lvh .c-chapter {
    --stickout: calc(var(--cw) * 168 / var(--aspect));
  }
  .c-chapter-wrap {
    padding-inline: calc(var(--sidegap) * .6);
  }
}

/* :::::: チャプターベース  :::::: */
.c-chapter__anchor {
  display: grid;
  justify-items: start;
  row-gap: .1em;
  position: absolute;
  bottom: 100%;
  left: 0;
}
.c-chapter__anchor > * {
  color: white;
  line-height: 1;
  background: var(--blue);
}
.c-chapter__anchor_title {
  --fontBasis: 24;
  display: flex;
  align-items: center;
  column-gap: .3em;
  padding: .1em .2em .2em .25em;
}
.c-chapter__anchor_title::before {
  content: "";
  height: .8em;
  border-left: 1px solid currentcolor;
}
.c-chapter__anchor_num {
  order: -1;
}
.c-chapter__anchor_subject {
  --fontBasis: 58;
  padding: 0 .1em .1em .1em;
}
@media (max-width: 767.98px) {
  .c-chapter__anchor_title {
    --fontBasis: 16;
  }
  .c-chapter__anchor_subject {
    --fontBasis: 31.29;
  }
}

/* :::::: セクションベース  :::::: */
.c-section {
  display: grid;
  z-index: 0;
  position: relative;
}
.c-section__subject {
  --fontBasis: 32;
  line-height: 1.5;
}
.c-section__paragraph {
  margin-top: 1em;
  line-height: 2;
}
.c-section__paragraph + .c-section__paragraph {
  margin-top: .5em;
}
.c-section__image {
  z-index: -1;
}
@media (min-width: 768px) {
  .c-section {
    grid-auto-flow: dense;
    align-content: center;
  }
  .c-section :where(*:nth-child(1)) { grid-row: 1; }
  .c-section :where(*:nth-child(2)) { grid-row: 2; }
  .c-section :where(*:nth-child(3)) { grid-row: 3; }
  .c-section__subject,
  .c-section__paragraph {
    grid-column: 1;
  }
  .c-section__image {
    grid-area: 1 / 1 / 4 / 3;
    place-self: center end;
  }
  .p-chapter1 .c-section__image img {
    width: min(var(--cw) * 344 / var(--aspect), 344px);
  }
  .p-chapter2 .c-section__image img {
    width: min(var(--cw) * 293 / var(--aspect), 293px);
    margin-top: -1em;
  }
  .p-chapter3 .c-section__image img {
    width: min(var(--cw) * 334 / var(--aspect), 334px);
  }
}
@media (max-width: 767.98px) {
  .c-section__subject {
    --fontBasis: 25;
  }
  .c-section__image {
    margin-top: 1em;
  }
  .p-chapter2 .c-section__paragraph {
    letter-spacing: -.04em;
  }
}

/* :::::: マーカー  :::::: */
.c-marker {
  z-index: 0;
  position: relative;
  font-weight: inherit;
}
.c-marker::before {
  content: "";
  z-index: -1;
  position: absolute;
  inset: 0 -.1em -.1em -.1em;
  background: var(--palered);
}
.c-marker.pnc::before {
  inset: 0 .4em -.1em -.1em;
}

/* :::::: まとめ :::::: */
.c-summary {
  z-index: 0;
  position: relative;
  margin-top: var(--space);
  text-align: center;
}
.c-summary {
  padding-bottom: min(var(--cw) * 64 / var(--aspect), 64px);
}
.c-summary__title {
  --fontBasis: 23;
  position: relative;
  width: 12em;
  margin: 0 auto;
  margin-bottom: min(var(--cw) * 40 / var(--aspect), 40px);
  padding: .3em 1em .4em;
  border-radius: 0 0 1.3em 1.3em;
  color: white;
  line-height: 1.4;
  letter-spacing: .1em;
  text-align: center;
  background: var(--blue);
}
.c-summary__subject {
  --fontBasis: 29;
}
.c-summary__paragraph {
  margin-top: .75em;
}
.c-summary__list {
  --col: 3;
  --circleBasis: 121;
  display: grid;
  grid-template-columns: repeat(var(--col), auto);
  justify-content: center;
  column-gap: calc(var(--circleBasis) / var(--col) * .4px);
}
.c-summary__item {
  line-height: 1.45;
}
.c-summary__circle {
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  width: min(var(--cw) * var(--circleBasis) / var(--aspect), var(--circleBasis) * 1px);
  height: auto;
  border: 1px solid currentcolor;
  border-radius: 50%;
  background: #e4eef6;
  font-size: var(--fontSize);
}
@media (min-width: 768px) {
  .c-summary__item dd {
    margin: 1em -1em 0;
  }
}
@media (max-width: 767.98px) {
  .c-summary {
    margin-top: min(var(--cw) * 64 / var(--aspect));
    padding-bottom: min(var(--cw) * 40 / var(--aspect));
  }
  .c-summary__title {
    --fontBasis: 16;
    margin-bottom: min(var(--cw) * 24 / var(--aspect));
    padding: .5em 1em .6em;
    border-radius: 0 0 .75em .75em;
  }
  .c-summary__subject {
    --fontBasis: 20;
  }
  .c-summary__circle {
    width: calc(var(--cw) * var(--circleBasis) / var(--aspect));
  }
}
/* 角取フレーム */
.c-summary-frame {
  --chamfer: 40px;
  --outerLine: min(var(--cw) * 11 / var(--aspect), 11px);
  --innerLine: min(var(--cw) * 2 / var(--aspect), 2px);
  z-index: -1;
  pointer-events: none;
}
.c-summary-frame,
.c-summary-frameline {
  position: absolute;
  inset: 0;
}
.c-summary-frameline {
  z-index: -1;
  border: var(--outerLine) solid currentcolor;
  box-shadow: inset 0 0 0 calc(var(--innerLine) * 1.5) white, inset 0 0 0 calc(var(--innerLine) * 2.5) currentcolor;
  clip-path: polygon(
    0 var(--chamfer), var(--chamfer) 0, 100% 0,
    100% calc(100% - var(--chamfer)), calc(100% - var(--chamfer)) 100%, 0 100%
  );
  background: white;
}
.c-summary-frame::before,
.c-summary-frame::after {
  content: "";
  position: absolute;
  width: calc(var(--chamfer) * 2);
  rotate: -45deg;
}
.c-summary-frame::before {
  top: calc(var(--chamfer) * .5);
  left: calc(var(--chamfer) * -.5);
  border-bottom: 2px solid currentcolor;
}
.c-summary-frame::after {
  right: calc(var(--chamfer) * -.5);
  bottom: calc(var(--chamfer) * .5);
  border-top: 2px solid currentcolor;
}
@media (max-width: 767.98px) {
  .c-summary-frame {
    --chamfer: calc(var(--cw) * 32 / var(--aspect));
    --outerLine: calc(var(--cw) * 8 / var(--aspect));
    --innerLine: calc(var(--cw) * 2 / var(--aspect));
  }
  .c-summary-frame::before,
  .c-summary-frame::after {
    border-width: 1px;
  }
}
/* 個別 */
.p-chapter1 .c-summary__circle {
  --fontBasis: 20.74;
}
.p-chapter2 .c-summary__list {
  --col: 5;
}
.p-chapter2 .c-summary__circle {
  --fontBasis: 14.5;
}
.p-chapter2 .c-summary__item dd {
  --fontBasis: 11.6;
}
.p-chapter3 .c-summary__paragraph {
  letter-spacing: .05em;
}
.p-chapter4 .c-summary__subject {
  --fontBasis: 40;
}
.p-chapter4 .c-summary__paragraph {
  letter-spacing: .01em;
}
@media (min-width: 768px) {
  .p-chapter1 .c-summary__list {
    --circleBasis: 162;
  }
  .p-chapter3 .c-summary__title {
    margin-bottom: min(var(--cw) * 32 / var(--aspect), 32px);
  }
  .p-chapter4 .c-summary__title {
    margin-bottom: min(var(--cw) * 24 / var(--aspect), 24px);
  }
  .p-chapter4 .c-summary__paragraph + .c-summary__paragraph {
    margin-top: .05em;
  }
}
@media (max-width: 767.98px) {
  .p-chapter1 .c-summary__list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1em;
  }
  .p-chapter1 .c-summary__circle {
    --fontBasis: 16;
  }
  .p-chapter1 .c-summary__item:first-child {
    margin-inline: 12.5%;
  }
  .p-chapter2 .c-summary__list {
    grid-template-columns: auto;
    row-gap: 1em;
  }
  .p-chapter2 .c-summary__item dd {
    --fontBasis: 16;
    text-align: left;
  }
  .p-chapter2 .c-summary__item {
    display: flex;
    align-items: center;
    column-gap: 1em;
  }
  .p-chapter2 .c-summary__circle {
    --fontBasis: 18;
  }
  .p-chapter2 .c-summary__item:nth-child(3) .c-summary__circle {
    --fontBasis: 16;
  }
  .p-chapter4 .c-summary__subject {
    --fontBasis: 24;
  }
  .p-chapter4 .c-summary__paragraph {
    margin-top: 1.25em;
  }
  .p-chapter4 .c-summary__paragraph + .c-summary__paragraph {
    margin-top: .5em;
  }
}

/* :::::: とは？ :::::: */
.c-issue {
  position: relative;
  margin: var(--space) calc(var(--sidegap) * -1) 0;
  padding: var(--space) var(--sidegap);
  color: white;
  background: var(--blue);
}
.c-issue::before {
  content: "";
  position: absolute;
  inset: -1px 0 auto;
  aspect-ratio: 83 / 18;
  width: min(var(--cw) * 166 / var(--aspect), 166px);
  margin-inline: auto;
  background: white;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.c-issue::after {
  content: "";
  display: block;
  clear: both;
}
.c-issue__subject {
  --fontBasis: 27.83;
  margin-inline: auto;
  padding-inline: 2em;
  line-height: 1.5;
  text-align: center;
  /* “” */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="43" height="38" viewBox="0 0 43 38" fill="%23f6beba"><path d="M10.462,37.488c-3.182,0-5.728-1.137-7.638-3.41C1.006,31.714.097,28.668.097,24.94.097,19.848,1.461,15.257,4.189,11.165,7.007,6.983,11.281,3.482,17.009.663l1.5,2.182c-2.728,1.637-5.228,3.955-7.501,6.956-2.182,2.91-3.273,5.865-3.273,8.865,0,.818.227,1.5.682,2.046.455.455,1.137.682,2.046.682,2.273,0,4.182.818,5.728,2.455,1.637,1.546,2.455,3.455,2.455,5.728s-.818,4.182-2.455,5.728c-1.546,1.455-3.455,2.182-5.728,2.182ZM34.057,37.488c-3.182,0-5.728-1.137-7.638-3.41-1.818-2.364-2.728-5.41-2.728-9.138,0-5.092,1.364-9.683,4.092-13.775,2.819-4.182,7.092-7.683,12.82-10.502l1.5,2.182c-2.728,1.637-5.228,3.955-7.501,6.956-2.182,2.91-3.273,5.865-3.273,8.865,0,.818.227,1.5.682,2.046.455.455,1.137.682,2.046.682,2.273,0,4.182.818,5.728,2.455,1.637,1.546,2.455,3.455,2.455,5.728s-.818,4.182-2.455,5.728c-1.546,1.455-3.455,2.182-5.728,2.182Z"/></svg>') left top / 1.25em auto no-repeat,
  url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="43" height="38" viewBox="0 0 43 38" fill="%23f6beba"><path d="M32.538.512c3.182,0,5.728,1.137,7.638,3.41,1.818,2.364,2.728,5.41,2.728,9.138,0,5.092-1.364,9.683-4.092,13.775-2.819,4.182-7.092,7.683-12.82,10.502l-1.5-2.182c2.728-1.637,5.228-3.955,7.501-6.956,2.182-2.91,3.273-5.865,3.273-8.865,0-.818-.227-1.5-.682-2.046-.455-.455-1.137-.682-2.046-.682-2.273,0-4.183-.818-5.728-2.455-1.637-1.546-2.455-3.455-2.455-5.728s.818-4.183,2.455-5.728c1.546-1.455,3.455-2.182,5.728-2.182ZM8.943.512c3.182,0,5.728,1.137,7.638,3.41,1.818,2.364,2.728,5.41,2.728,9.138,0,5.092-1.364,9.683-4.091,13.775-2.819,4.182-7.092,7.683-12.82,10.502l-1.5-2.182c2.728-1.637,5.228-3.955,7.501-6.956,2.182-2.91,3.273-5.865,3.273-8.865,0-.818-.227-1.5-.682-2.046-.455-.455-1.137-.682-2.046-.682-2.273,0-4.183-.818-5.728-2.455-1.637-1.546-2.455-3.455-2.455-5.728,0-2.273.818-4.183,2.455-5.728,1.546-1.455,3.455-2.182,5.728-2.182Z"/></svg>') right top / 1.25em auto no-repeat;
}
@media (min-width: 768px) {
  .c-issue__subject {
    width: fit-content;
  }
}
@media (max-width: 767.98px) {
  .c-issue {
    margin: var(--space) calc(var(--sidegap) * -.6) 0;
    padding: var(--space) calc(var(--sidegap) * .6) calc(var(--space) * .6);
  }
  .c-issue::before {
    width: calc(var(--cw) * 80 / var(--aspect));
  }
  .c-issue__subject {
    --fontBasis: 21;
    margin-inline: calc(var(--cw) * 4 / var(--aspect));
    padding-inline: 0;
    background-size: calc(.43em * 2) calc(.38em * 2);
    background-position: left top .2em, right top .2em;
  }
  .p-chapter4 .c-issue__subject {
    margin-right: -.4em;
    margin-left: -.2em;
    padding-inline: 1em;
    white-space: nowrap;
  }
  .c-article .c-issue__subject {
    --fontBasis: 24;

  }
}

/* :::::: 続きを読む :::::: */
.c-issue__image {
  --radius: min(var(--cw) * 17.23 / var(--aspect), 17.23px);
  position: relative;
  margin-top: min(var(--cw) * 24 / var(--aspect), 24px);
}
.c-issue__image_inner {
  overflow: hidden;
  display: inherit;
  border: min(var(--cw) * 11.2 / var(--aspect), 11.2px) solid #79a3c2;
  border-radius: var(--radius);
}
.c-issue__image figcaption {
  position: absolute;
  right: min(100% + var(--cw) * 4 / var(--aspect), 100% + 4px);
  bottom: min(var(--cw) * 4 / var(--aspect), 4px);
  width: min(var(--cw) * 9 / var(--aspect), 9px);
}
.c-issue__seemore {
  --fontBasis: 10.55;
  display: grid;
  place-content: center;
  row-gap: .2em;
  z-index: 0;
  position: relative;
  aspect-ratio: 1 / 1;
  width: 14.284em;
  padding-bottom: .25em;
  border-radius: 50%;
  line-height: 1.25;
  text-align: center;
}
.c-issue__seemore {
  float: right;
  margin: -10.98em -2em 0 0;
}
.c-issue__seemore::before,
.c-issue__seemore::after {
  content: "";
  z-index: -1;
  position: absolute;
  border-radius: inherit;
}
.c-issue__seemore::before {
  inset: 0;
  background: var(--red);
}
.c-issue__seemore::after {
  inset: .47em;
  border: 1px solid currentcolor;
}
.c-issue__seemore_sub {
  font-family: var(--fontEn);
  letter-spacing: .05em;
}
.c-issue__seemore_main {
  font-size: 161%;
}
.c-issue__seemore_arr {
  justify-self: center;
  width: 3.88em;
  height: auto;
  margin-top: 1.25em;
  overflow: visible;
  fill: none;
  stroke: currentcolor;
  stroke-dasharray: 49 49;
  animation: attention 2s var(--easeInOut) infinite;
}
@keyframes attention {
  from, 25% { stroke-dashoffset: 98; }
  75%, to { stroke-dashoffset: 0; }
}
@media (hover) {
  .c-issue [data-modal] {
    cursor: pointer;
  }
  .c-issue__image_inner img,
  .c-issue__seemore::after {
    transition: scale .4s var(--easeOut);
  }
  .c-issue__seemore::before {
    transition: background-color .4s, scale .4s var(--easeOut);
  }
  [data-modal]:hover .c-issue__image_inner img {
    scale: 1.05;
    transition-duration: .3s;
  }
  [data-modal]:hover .c-issue__seemore::before,
  [data-modal]:hover .c-issue__seemore::after {
    scale: 1.1;
    transition-duration: .3s;
  }
  [data-modal]:hover .c-issue__seemore::before {
    background-color: #d20b13;
  }
}
@media (min-width: 768px) {
  .c-issue__seemore {
    margin: -10.98em -2em 0 0;
  }
}
@media (max-width: 767.98px) {
  .c-issue__image {
    --radius: calc(var(--cw) * 6.25 / var(--aspect));
    padding: calc(var(--cw) * 5.46 / var(--aspect));
  }
  .c-issue__image figcaption {
    right: calc(100% + var(--cw) * 4 / var(--aspect));
    bottom: calc(var(--cw) * 2 / var(--aspect));
    width: calc(var(--cw) * 5 / var(--aspect));
  }
  .c-issue__seemore {
    --fontBasis: 10.08;
    margin: -4em .5em 0 0;
  }
}

/**
 * 03 | ありたい姿 目指す山頂
 * ---------------------------------------- */
.p-chapter3__container1,
.p-chapter3__container2 {
  position: relative;
  margin-top: min(var(--cw) * var(--margin) / var(--aspect), var(--margin) * 1px);
  padding: min(var(--cw) * 32 / var(--aspect), 32px) 1em;
  border: 2px solid currentcolor;
  border-radius: min(var(--cw) * 30 / var(--aspect), 30px);
}
.p-chapter3__container1 {
  --margin: 64;
  display: grid;
  place-content: center;
  place-items: center;
}
.p-chapter3__container2 {
  --margin: 24;
  display: grid;
  place-items: center;
  padding: min(var(--cw) * 32 / var(--aspect), 32px);
  padding-top: 0;
}
@media (min-width: 768px) {
  .p-chapter3__container1 {
    grid-template-columns: auto auto;
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__container1 {
    row-gap: 1em;
  }
  .p-chapter3__container1,
  .p-chapter3__container2 {
    --padding: calc(var(--cw) * 16 / var(--aspect));
    padding-inline: var(--padding);
  }
  .p-chapter3__container2 {
    --margin: 0;
    padding-bottom: 0;
  }
}
:where(.p-chapter3__container1) > :not(.p-chapter3__label),
:where(.p-chapter3__container2) > :not(.p-chapter3__label) {
  grid-area: 1 / 1;
}
.p-chapter3__label {
  --fontBasis: 27.39;
  position: absolute;
  top: -.8em;
  left: 1em;
  color: white;
  line-height: 1.5;
  white-space: nowrap;
}
.p-chapter3__label span {
  padding-inline: .1em;
  background: var(--blue);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
@media (min-width: 768px) {
  .p-chapter3__label span {
    mask: linear-gradient(to top, #fff 90%, #fff0 90%);
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__label {
    --fontBasis: 16;
    z-index: 1;
    left: calc(var(--sidegap) * -.6 - 2px);
    line-height: 2;
  }
  .p-chapter3__label span {
    padding: .1em .4em .2em;
  }
}

/* :::::: 実現したいもの :::::: */
.p-chapter3__subject {
  --fontBasis: 24;
  text-indent: -.5em;
}
.p-chapter3__paragraph1 {
  --fontBasis: 15;
  z-index: 0;
  position: relative;
  margin: 1em 0;
  padding: min(var(--cw) * 40 / var(--aspect), 40px) 0;
  text-align: center;
}
.p-chapter3__paragraph1::before {
  content: "";
  z-index: -1;
  position: absolute;
  inset: 0;
  width: 20px;
  margin: 0 auto;
  background: var(--arrowUp) center top / 100% auto no-repeat;
}
.p-chapter3__paragraph1 span {
  display: inline-block;
  background: white;
}
@media (min-width: 768px) {
  .p-chapter3__image {
    grid-column: 2;
    width: min(var(--cw) * 300 / var(--aspect), 300px);
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__subject {
    --fontBasis: 20;
  }
  .p-chapter3__paragraph1 {
    --fontBasis: 16;
  }
  .p-chapter3__paragraph1::before {
    width: calc(var(--cw) * 20 / var(--aspect));
  }
  .p-chapter3__image {
    grid-row: 2;
    width: min(var(--cw) * 260 / var(--aspect));
  }
}
.p-section__paragraph,
.p-chapter3__paragraph2,
.p-chapter3__paragraph3,
.p-chapter3__paragraph4,
.p-chapter3__item {
  text-align: center;
}
.p-chapter3__paragraph2 {
  --fontBasis: 28;
  margin-top: 1.25em;
}
.p-chapter3__paragraph3 {
  --fontBasis: 18;
  margin-top: .5em;
}
.p-chapter3__paragraph4 {
  --fontBasis: 16;
  margin-top: 3em;
}
.p-chapter3__list {
  display: flex;
}
.p-chapter3__item {
  --size: 8em;
  --fontBasis: 12;
  display: grid;
  place-items: center;
  width: var(--size);
  height: var(--size);
  border: 1px solid currentcolor;
  border-radius: var(--size);
  line-height: 1.25;
  background: #e4eef6;
}
.p-chapter3__item:nth-child(3) {
  padding-top: .25em;
}
@media (min-width: 768px) {
  .p-chapter3__list {
    display: flex;
    justify-content: space-between;
    margin-top: max(var(--cw) * -48 / var(--aspect), -48px);
  }
  .p-chapter3__item:nth-child(2),
  .p-chapter3__item:nth-last-child(2) {
    margin-top: 5em;
  }
  .p-chapter3__item:nth-child(2) {
    margin-left: -2%;
  }
  .p-chapter3__item:nth-last-child(2) {
    margin-right: -2%;
  }
  .p-chapter3__item:nth-child(3),
  .p-chapter3__item:nth-last-child(3) {
    margin-top: 7em;
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__paragraph2 {
    --fontBasis: 20;
    margin-top: 3em;
  }
  .p-chapter3__paragraph3 {
    --fontBasis: 16;
  }
  .p-chapter3__paragraph3 + .p-chapter3__paragraph3 {
    margin-top: 2em;
  }
  .p-chapter3__list {
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(var(--cw) * 16 / var(--aspect));
    margin-top: 4em;
  }
  .p-chapter3__item {
    --size: calc(var(--cw) * 84 / var(--aspect));
  }
  .p-chapter3__item:last-child {
    --fontBasis: 10;
  }
  .p-chapter3 .p-chapter3__paragraph4 {
    margin-top: 2em;
  }
  .p-chapter3 .c-chapter-wrap {
    display: grid;
  }
  .p-chapter3 .p-chapter3__paragraph4,
  .p-chapter3 .c-summary,
  .p-chapter3 .c-issue {
    order: 1;
  }
  .p-chapter3 .c-summary {
    padding-bottom: calc(var(--cw) * 80 / var(--aspect));
  }
  .p-chapter3 .c-summary__title {
    margin-bottom: 2.5em;
  }
}

/* :::::: パーソルが提供するもの :::::: */
.p-chapter3__flow_state {
  --fontBasis: 11;
  display: block;
  text-align: center;
}
.p-chapter3__flow {
  display: grid;
  justify-content: center;
  justify-items: center;
  margin-top: max(var(--cw) * -24 / var(--aspect), -24px);
  text-align: center;
}
.p-chapter3__flow li {
  position: relative;
}
.p-chapter3__flow1 {
  grid-area: 2 / 1;
}
.p-chapter3__flow2 {
  grid-area: 2 / 2;
}
.p-chapter3__flow3 {
  grid-area: 1 / 1 / 2 / 3;
}
.p-chapter3__flow li > * {
  font-size: var(--fontSize);
  line-height: 1.6;
  --fontSize: clamp(var(--fontMin), var(--cw) * var(--fontBasis) / var(--aspect), var(--fontBasis) * 1px);
}
.p-chapter3__flow_theme {
  --fontBasis: 17;
  display: grid;
  place-items: center;
  position: relative;
  width: 11em;
  border-radius: 38.41px;
  color: white;
  line-height: 1.4;
  background: #23689b;
}
.p-chapter3__flow3 .p-chapter3__flow_theme {
  --fontBasis: 21;
}
.p-chapter3__flow_balloon {
  --fontBasis: 13;
  display: grid;
  place-items: center;
  width: min(var(--cw) * 180 / var(--aspect), 180px);
  height: min(var(--cw) * 112 / var(--aspect), 112px);
  position: absolute;
}
.p-chapter3__flow3 .p-chapter3__flow_balloon {
  width: min(var(--cw) * 203 / var(--aspect), 203px);
}
.p-chapter3__flow_balloon-t {
  position: relative;
}
.p-chapter3__flow_balloon-bln,
.p-chapter3__flow_balloon-tail {
  overflow: visible;
  position: absolute;
  fill: white;
  stroke: currentcolor;
}
.p-chapter3__flow_balloon-bln {
  inset: 0;
  width: 100%;
  height: 100%;
}
.p-chapter3__flow1_theme-img {
  position: absolute;
  bottom: -1em;
  width: min(var(--cw) * 69 / var(--aspect), 69px);
}
.p-chapter3__flow3 .p-chapter3__flow_theme {
  z-index: initial;
  aspect-ratio: 1 / 1;
  width: 9em;
  height: 9em;
  border-radius: 50%;
}
.p-chapter3__flow3::before,
.p-chapter3__flow3::after {
  content: "";
  position: absolute;
  top: 100%;
  height: 4em;
  width: 20px;
  background: var(--arrowUp) center top / 100% auto no-repeat;
  transform-origin: center top;
}
.p-chapter3__flow3::before {
  left: .5em;
  rotate: 30deg;
}
.p-chapter3__flow3::after {
  right: .5em;
  rotate: -30deg;
}
@media (min-width: 768px) {
  .p-chapter3__flow_state {
    margin-top: 7em;
  }
  .p-chapter3__flow {
    row-gap: min(var(--cw) * 80 / var(--aspect), 80px);
    column-gap: min(var(--cw) * 30 / var(--aspect), 30px);
  }
  .p-chapter3__flow_theme {
    z-index: 1;
    padding: 1.5em;
  }
  .p-chapter3__flow3 .p-chapter3__flow_theme {
    padding-bottom: 3em;
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__flow_state {
    margin-top: -3em;
  }
  .p-chapter3__flow {
    justify-content: space-between;
    row-gap: calc(var(--cw) * 144 / var(--aspect));
    width: 100%;
  }
  .p-chapter3__flow li > * {
      --fontSize: max(var(--cw) * var(--fontBasis) / var(--aspect), var(--fontMin));
  }
  .p-chapter3__flow_theme {
    width: 8em;
    height: 8em;
    padding: 1em 1em 1.5em;
  }
  .p-chapter3__flow_balloon {
    --fontBasis: 12;
    width: calc(var(--cw) * 180 / var(--aspect));
    height: calc(var(--cw) * 112 / var(--aspect));
  }
  .p-chapter3__flow1 {
    clip-path: inset(0 -20px 0 calc(var(--padding) * -1) round 30px);
  }
  .p-chapter3__flow2 {
    clip-path: inset(0 calc(var(--padding) * -1) 0 -20px round 30px);
  }
  .p-chapter3__flow3::before,
  .p-chapter3__flow3::after {
    top: 135%;
    width: calc(var(--cw) * 20 / var(--aspect));
  }
  .p-chapter3__flow3::before {
    rotate: 15deg;
  }
  .p-chapter3__flow3::after {
    rotate: -15deg;
  }
  .p-chapter3__flow3 .p-chapter3__flow_theme {
    padding-bottom: 2em;
  }
  .p-chapter3__flow3 .p-chapter3__flow_balloon {
    width: calc(var(--cw) * 203 / var(--aspect));
  }
  .p-culturedeck .l-contents .p-chapter3__flow1_theme-img {
    width: calc(var(--cw) * 48 / var(--aspect));
  }
  .p-culturedeck .l-contents .p-chapter3__flow3 .p-chapter3__flow1_theme-img {
    width: calc(var(--cw) * 64 / var(--aspect));
  }
}
@media (min-width: 768px) {
  /* 多様な働き方への気づき */
  .p-chapter3__flow1 .p-chapter3__flow1_theme-img {
    right: 80%;
  }
  .p-chapter3__flow1 .p-chapter3__flow_balloon {
    right: 75%;
    bottom: 75%;
  }
  .p-chapter3__flow1 .p-chapter3__flow_balloon-tail {
    left: 48%;
    top: calc(100% - 2px);
  }
  /* 学びの機会の提供 */
  .p-chapter3__flow2 .p-chapter3__flow1_theme-img {
    left: 80%;
  }
  .p-chapter3__flow2 .p-chapter3__flow_balloon-tail {
    right: 48%;
    top: calc(100% - 2px);
  }
  .p-chapter3__flow2 .p-chapter3__flow_balloon {
    left: 75%;
    bottom: 75%;
  }
  /* はたらく機会の創出 */
  .p-chapter3__flow3 .p-chapter3__flow_balloon {
    top: 20%;
    left: 90%;
  }
  .p-chapter3__flow3 .p-chapter3__flow_balloon-tail {
    right: calc(100% - 2px);
    top: 50%;
  }
}
@media (max-width: 767.98px) {
  .p-chapter3__flow1,
  .p-chapter3__flow2 {
    padding-bottom: 7.4em;
  }
  /* 多様なはたらき方の提供 */
  .p-chapter3__flow1 .p-chapter3__flow1_theme-img {
    bottom: -1.5em;
    left: .5em;
  }
  .p-chapter3__flow1 .p-chapter3__flow_balloon {
    right: -.5em;
    bottom: -.5em;
  }
  .p-chapter3__flow1 .p-chapter3__flow_balloon-tail {
    left: 58%;
    bottom: calc(100% - 2.5px);
    width: calc(var(--cw) * 25 / var(--aspect));
    height: auto;
    rotate: 190deg;
  }
  /* 学びの機会の提供 */
  .p-chapter3__flow2 .p-chapter3__flow1_theme-img {
    bottom: -1.5em;
    right: .5em;
  }
  .p-chapter3__flow2 .p-chapter3__flow_balloon {
    bottom: -.5em;
    left: -.5em;
  }
  .p-chapter3__flow2 .p-chapter3__flow_balloon-tail {
    right: 58%;
    bottom: calc(100% - 2.5px);
    width: calc(var(--cw) * 24 / var(--aspect));
    height: auto;
    rotate: 170deg;
  }
  /* はたらく機会の創出 */
  .p-chapter3__flow3 .p-chapter3__flow1_theme-img {
    bottom: -.2em;
    right: -1em;
  }
  .p-chapter3__flow3 .p-chapter3__flow_balloon {
    top: 70%;
    right: 20%;
  }
  .p-chapter3__flow3 .p-chapter3__flow_balloon-tail {
    top: 34%;
    left: calc(100% - 2.5px);
    width: calc(var(--cw) * 21 / var(--aspect));
    height: auto;
    rotate: 186deg;
  }
}

/**
 * 04 | グループビジョン 山頂からの景色
 * ---------------------------------------- */
.p-chapter4__item {
  display: grid;
  grid-auto-flow: dense;
  align-items: start;
  z-index: 0;
  position: relative;
}
.p-chapter4__balloon {
  z-index: 1;
  position: relative;
  width: fit-content;
  padding: 2em 2.5em;
  border-radius: min(var(--cw) * var(--blnR) / var(--aspect), var(--blnR) * 1px);
  white-space: nowrap;
  background: #e4eef6;
}
.p-chapter4__balloon::after {
  content: "";
  position: absolute;
  background: #e4eef6;
}
.p-chapter4__balloon b {
  font-weight: inherit;
  line-height: 1.4;
}
.p-chapter4__image {
  width: var(--imgSize);
  border-radius: min(var(--cw) * var(--imgR) / var(--aspect), var(--imgR) * 1px);
}
.p-chapter4__image * {
  border-radius: inherit;
}
@media (max-width: 767.98px) {
  .p-chapter4__image {
    border-radius: calc(var(--cw) * var(--imgR) / var(--aspect));
  }
  .p-chapter4 .c-summary {
    padding-bottom: calc(var(--cw) * 80 / var(--aspect));
  }
  .p-chapter4 .c-summary__title {
    margin-bottom: 2.5em;
  }
}

/* :::::: ふきだし/画像サイズ/フォントサイズ :::::: */
.p-chapter4__item {
  --imgR: 40;
  --blnR: 30;
}
.p-chapter4__item:nth-child(1) {
  --imgBasis: 198;
  --blnR: 40;
}
.p-chapter4__item:nth-child(2) {
  --imgBasis: 175;
}
.p-chapter4__item:nth-child(3) {
  --imgBasis: 237;
  --blnR: 40;
}
.p-chapter4__item:nth-child(4) {
  --imgBasis: 210;
}
.p-chapter4__item:nth-child(5) {
  --imgBasis: 191;
}
.p-chapter4__balloon {
  --fontBasis: 12;
}
.p-chapter4__balloon b {
  font-size: 150%;
}
.p-chapter4__item:nth-child(1) .p-chapter4__balloon b,
.p-chapter4__item:nth-child(3) .p-chapter4__balloon b {
  font-size: 166.67%;
}
@media (min-width: 768px) {
  .p-chapter4__item:nth-child(1) .p-chapter4__balloon::after {
    top: calc(100% - 1px);
    right: 12%;
    width: 2em;
    height: 2em;
    clip-path: polygon(0 0, 80% 0, 100% 100%);
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__balloon::after {
    top: 46%;
    right: calc(100% - 1px);
    width: 2em;
    height: 1.2em;
    clip-path: polygon(0 0, 100% 10%, 100% 100%);
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon::after {
    top: 40%;
    right: calc(100% - 1px);
    width: 2.5em;
    height: 2em;
    clip-path: polygon(0 0, 100% 10%, 100% 100%);
  }
  .p-chapter4__item:nth-child(4) .p-chapter4__balloon::after {
    bottom: calc(100% - 1px);
    right: 10%;
    width: 2em;
    height: 2em;
    clip-path: polygon(0 100%, 100% 0, 80% 100%);
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__balloon::after {
    top: 50%;
    left: calc(100% - 1px);
    width: 2em;
    height: 1.2em;
    clip-path: polygon(0 0, 100% 100%, 0 90%);
  }
}
@media (max-width: 767.98px) {
  .p-chapter4__item:nth-child(1) {
    --imgR: 40;
    --imgBasis: 160;
  }
  .p-chapter4__item:nth-child(4) {
    order: 1;
    --imgR: 26;
    --imgBasis: 169;
  }
  .p-chapter4__item:nth-child(2) {
    order: 2;
    --imgR: 30;
    --imgBasis: 277;
  }
  .p-chapter4__item:nth-child(3) {
    order: 3;
    --imgR: 53;
    --imgBasis: 297;
  }
  .p-chapter4__item:nth-child(5) {
    order: 4;
    --imgR: 30;
    --imgBasis: 178;
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__image {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__balloon::after {
    top: calc(100% - 1px);
    right: 28%;
    width: 2em;
    height: 1.7em;
    clip-path: polygon(0 0, 80% 0, 100% 100%);
  }
  .p-chapter4__item:nth-child(4) .p-chapter4__balloon::after {
    bottom: 30%;
    right: calc(100% - 1px);
    width: 2em;
    height: 1.2em;
    clip-path: polygon(0 0, 100% 10%, 100% 100%);
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__balloon::after {
    bottom: calc(100% - 1px);
    left: 23%;
    width: 1.2em;
    height: 1.5em;
    clip-path: polygon(100% 0, 80% 100%, 0 100%);
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon::after {
    top: calc(100% - 1px);
    right: 15%;
    width: 2em;
    height: 1.7em;
    clip-path: polygon(25% 0, 100% 0, 0 100%);
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__balloon::after {
    top: calc(var(--cw) * var(--imgR) / var(--aspect));
    left: calc(100% - 1px);
    width: 1.5em;
    height: 1em;
    clip-path: polygon(0 10%, 100% 0, 0 100%);
  }
}

/* :::::: レイアウト :::::: */
@media (min-width: 768px) {
  .p-chapter4 .c-section {
    float: left;
  }
  .p-chapter4__lineup::after {
    content: "";
    display: block;
    clear: both;
  }
  .p-chapter4__item:nth-child(1) {
    float: right;
    justify-items: end;
  }
  .p-chapter4__item:nth-child(2) {
    float: right;
    --mt: -14;
    --mr: 8;
  }
  .p-chapter4__item:nth-child(3) {
    float: left;
    --mt: -18;
  }
  .p-chapter4__item:nth-child(4) {
    float: right;
    --mt: -32;
  }
  .p-chapter4__item:nth-child(5) {
    float: left;
    --mt: 12;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__image {
    --mt: -18;
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__image {
    --mr: -18;
  }
  .p-chapter4__item:nth-child(4) .p-chapter4__image {
    justify-self: end;
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__image {
    grid-column: 2;
    --mt: 24;
    --ml: -12;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__balloon {
    --mr: 42;
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__balloon {
    grid-column: 2;
    --mt: 8;
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon {
    grid-column: 2;
    --mt: 32;
    --ml: -24;
  }
  .p-chapter4__item:nth-child(4) .p-chapter4__balloon {
    grid-row: 2;
    --mt: -24;
    --mr: 60;
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__balloon {
    --mt: -6;
  }
  .p-chapter4__item,
  .p-chapter4__item .p-chapter4__balloon,
  .p-chapter4__item .p-chapter4__image {
    margin-top: min(var(--cw) * var(--mt, 0) / var(--aspect), var(--mt, 0) * 1px);
    margin-right: min(var(--cw) * var(--mr, 0) / var(--aspect), var(--mr, 0) * 1px);
    margin-bottom: min(var(--cw) * var(--mb, 0) / var(--aspect), var(--mb, 0) * 1px);
    margin-left: min(var(--cw) * var(--ml, 0) / var(--aspect), var(--ml, 0) * 1px);
  }
}
@media (max-width: 767.98px) {
  .p-chapter4__lineup {
    display: grid;
    overflow: hidden;
    margin-top: calc(var(--cw) * 24 / var(--aspect));
    margin-inline: calc(var(--sidegap) * -.6);
  }
  .p-chapter4__item > * {
    grid-area: 1 / 1;
  }
  .p-chapter4__item:nth-child(4) {
    --mt: -36;
  }
  .p-chapter4__item:nth-child(2) {
    --mt: 32;
  }
  .p-chapter4__item:nth-child(3) {
    --mt: 24;
  }
  .p-chapter4__item:nth-child(5) {
    --mt: 20;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__image,
  .p-chapter4__item:nth-child(4) .p-chapter4__balloon,
  .p-chapter4__item:nth-child(2) .p-chapter4__image,
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon,
  .p-chapter4__item:nth-child(5) .p-chapter4__image {
    justify-self: end;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__image {
    z-index: 1;
    --mt: 120;
  }
  .p-chapter4__item:nth-child(4) .p-chapter4__balloon {
    --mt: 62;
    --mr: .6;
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__image {
    --mt: 0;
  }
  .p-chapter4__item:nth-child(2) .p-chapter4__balloon {
    --mt: 104;
    --ml: .4;
    padding-left: 2em;
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__image {
    --mt: 176;
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon {
    --mt: 0;
    --ml: .6;
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__image {
    --mt: 0;
  }
  .p-chapter4__item:nth-child(5) .p-chapter4__balloon {
    --mt: 74;
    --ml: .6;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__image,
  .p-chapter4__item:nth-child(2) .p-chapter4__image,
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon,
  .p-chapter4__item:nth-child(5) .p-chapter4__image {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__balloon,
  .p-chapter4__item:nth-child(4) .p-chapter4__image {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .p-chapter4__item:nth-child(1) .p-chapter4__balloon {
    padding-left: 2em;
  }
  .p-chapter4__item:nth-child(3) .p-chapter4__balloon {
    padding-right: 1em;
  }
  .p-chapter4__item,
  .p-chapter4__item .p-chapter4__balloon,
  .p-chapter4__item .p-chapter4__image {
    margin-top: calc(var(--cw) * var(--mt, 0) / var(--aspect));
    margin-right: calc(var(--sidegap) * var(--mr));
    margin-bottom: calc(var(--cw) * var(--mb, 0) / var(--aspect));
    margin-left: calc(var(--sidegap) * var(--ml));
  }
}

/* :::::: 山のあしらい :::::: */
.p-chapter4__item::before {
  content: "";
  z-index: -1;
  position: absolute;
  width: calc(var(--cw) * var(--w, 0) / var(--aspect));
  height: calc(var(--cw) * var(--h, 0) / var(--aspect));
}
@media (min-width: 768px) {
  .p-chapter4__item {
    --mount1: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="159" height="55" viewBox="0 0 159 55" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1,43.533c2.137-9.262,13.335-17.45,20.475-22.05,8.701-5.606,17.329-11.856,26.61-16.496,3.013-1.506,6.43-2.075,9.409-3.565,2.258-1.129,4.539.187,6.176,1.824,4.969,4.969,7.702,11.793,13.429,16.248,4.26,3.313,7.346,8.257,11.191,12.103M74.367,48.264c.386.097,5.272-7.056,6.3-8.124,3.102-3.219,5.449-7.107,8.953-9.948,4.988-4.045,10.051-7.44,15.958-10.196,5.101-2.38,10.401,2.646,14.258,5.513,5.841,4.341,11.636,8.749,17.532,13.015,6.829,4.939,13.635,10.347,20.559,14.963"/></svg>') center / cover no-repeat;
    --mount2: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="192" height="44" viewBox="0 0 192 44" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1,40.873c6.801-8.05,12.789-14.773,22.589-18.693,6.886-2.754,14.437-4.502,21.097-7.751,6.298-3.072,11.712-9.061,17.574-12.725,4.13-2.581,9.977,2.585,12.435,5.015,4.657,4.606,5.658,6.416,12.103,7.336,3.382.483,4.238,5.375,7.295,6.507,2.234.827,6.104,3.062,6.88,5.388M80.828,42.365c5.03-4.765,11.075-9.186,16.911-12.932,3.484-2.236,5.897-5.574,9.657-7.544,2.709-1.419,5.757-.91,8.497-2.28,4.659-2.329,8.038-4.033,13.512-4.103,12.16-.156,18.842,6.159,26.9,14.217,3.903,3.903,10.086,4.476,15.17,5.471,6.832,1.337,12.714,4.165,19.025,7.171"/></svg>') center / cover no-repeat;
    --mount3: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="158" height="53" viewBox="0 0 158 53" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1,36.174c1.286-8.57,12.984-13.96,17.16-21.222,4.476-7.785,25.084-13.401,31.169-3.979,2.66,4.118,3.114,8.39,7.544,11.191,3.107,1.965,7.041,2.802,8.29,6.549M52.512,44.383c9.485-9.485,18.277-20.418,25.408-31.708,3.084-4.883,10.097-10.818,16.289-10.818,3.925,0,8.78-1.683,12.641-.332,2.979,1.042,5.85,4.108,8.124,6.093,3.644,3.181,7.683,6.072,11.233,9.326,3.56,3.264,6.561,7.475,9.864,11.108,7.062,7.768,13.234,15.754,20.89,23.045"/></svg>') center / cover no-repeat;
  }
  .p-chapter4__item:nth-child(1)::before {
    --w: 159;
    --h: 55;
    bottom: 20%;
    left: 0;
    background: var(--mount1);
  }
  .p-chapter4__item:nth-child(2)::before {
    --w: 192;
    --h: 44;
    right: 84%;
    bottom: 42%;
    background: var(--mount2);
  }
  .p-chapter4__item:nth-child(3) {
    z-index: 1;
  }
  .p-chapter4__item:nth-child(3)::before {
    --w: 192;
    --h: 44;
    bottom: 8%;
    left: 12%;
    background: var(--mount2);
  }
  .p-chapter4__item:nth-child(4)::before {
    --w: 158;
    --h: 53;
    bottom: 130%;
    left: 20%;
    background: var(--mount3);
  }
}
@media (max-width: 767.98px) {
  .p-chapter4__item {
    --mount1: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="167" height="41" viewBox="0 0 167 41" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M-13.202,38.593C-6.79,31.003-1.145,24.665,8.096,20.969c6.492-2.597,13.611-4.245,19.891-7.308,5.938-2.897,11.043-8.543,16.569-11.997,3.894-2.434,9.407,2.437,11.723,4.728,4.391,4.343,5.335,6.049,11.411,6.917,3.189.456,3.996,5.068,6.878,6.135,2.106.78,5.756,2.887,6.487,5.08M62.062,40c4.742-4.493,10.442-8.661,15.944-12.192,3.285-2.108,5.56-5.255,9.105-7.112,2.554-1.338,5.428-.858,8.011-2.149,4.392-2.196,7.578-3.803,12.739-3.869,11.464-.147,17.765,5.806,25.362,13.404,3.68,3.68,9.509,4.22,14.303,5.158,6.44,1.26,11.987,3.927,17.937,6.76"/></svg>') center / cover no-repeat;
    --mount2: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="127" height="43" viewBox="0 0 127 43" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1.742,36.662c1.792-7.766,11.181-14.631,17.167-18.488,7.296-4.701,14.53-9.941,22.311-13.831,2.526-1.263,5.391-1.74,7.889-2.989,1.893-.947,3.806.157,5.178,1.529,4.167,4.166,6.458,9.888,11.26,13.623,3.572,2.778,6.159,6.924,9.383,10.148M63.257,40.628c.324.081,4.42-5.917,5.283-6.812,2.6-2.699,4.568-5.958,7.506-8.34,4.183-3.391,8.427-6.238,13.38-8.549,4.277-1.996,8.721,2.219,11.955,4.622,4.897,3.64,9.756,7.336,14.7,10.912,5.725,4.142,11.432,8.676,17.237,12.546"/></svg>') center / cover no-repeat;
    --mount3: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="72" height="31" viewBox="0 0 72 31" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1,25.421c.324.081,4.42-5.917,5.282-6.811,2.601-2.699,4.569-5.959,7.506-8.341,4.182-3.391,8.427-6.238,13.38-8.549,4.277-1.996,8.721,2.219,11.955,4.622,4.897,3.64,9.757,7.336,14.7,10.912,5.725,4.142,11.372,8.676,17.177,12.546"/></svg>') center / cover no-repeat;
    --mount4: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="192" height="44" viewBox="0 0 192 44" fill="none" stroke="%2335709c" stroke-linecap="round" stroke-width="2"><path d="M1,40.873c6.801-8.05,12.789-14.773,22.589-18.693,6.886-2.754,14.437-4.502,21.097-7.751,6.298-3.072,11.712-9.061,17.574-12.725,4.13-2.581,9.977,2.585,12.435,5.015,4.657,4.606,5.658,6.416,12.103,7.336,3.382.483,4.238,5.375,7.295,6.507,2.234.827,6.104,3.062,6.88,5.388M80.829,42.365c5.03-4.765,11.075-9.186,16.911-12.932,3.484-2.236,5.897-5.574,9.657-7.544,2.709-1.419,5.757-.91,8.497-2.28,4.659-2.329,8.038-4.033,13.512-4.103,12.16-.156,18.842,6.159,26.9,14.217,3.903,3.903,10.086,4.476,15.17,5.471,6.832,1.337,12.714,4.165,19.025,7.171"/></svg>') center / cover no-repeat;
  }
  .p-chapter4__item:nth-child(4)::before {
    --w: 167;
    --h: 41;
    bottom: -12%;
    left: 0;
    background: var(--mount1);
  }
  .p-chapter4__item:nth-child(2)::before {
    --w: 127;
    --h: 43;
    right: 0;
    bottom: -4%;
    background: var(--mount2);
  }
  .p-chapter4__item:nth-child(3)::before {
    --w: 72;
    --h: 31;
    left: 6%;
    bottom: 60%;
    background: var(--mount3);
  }
  .p-chapter4__item:nth-child(5)::before {
    --w: 192;
    --h: 44;
    left: 6%;
    top: 3%;
    background: var(--mount4);
  }
}

/**
 * 理念体系
 * ---------------------------------------- */
.p-philosophy {
  --outerLine: min(var(--cw) * 20 / var(--aspect), 20px);
  --innerLine: min(var(--cw) * 2 / var(--aspect), 2px);
  z-index: 1;
  position: relative;
  width: 100%;
  padding: 0 var(--sidegap) var(--space);
  text-align: center;
}
.p-philosophy::before {
  content: "";
  z-index: -1;
  position: absolute;
  inset: 0;
  border: var(--outerLine) solid currentcolor;
  box-shadow: inset 0 0 0 calc(var(--innerLine) * 1.5) white, inset 0 0 0 calc(var(--innerLine) * 2.5) currentcolor;
  background: white;
}
.p-philosophy__subject {
  --fontBasis: 28;
  width: fit-content;
  margin-inline: auto;
  padding: .4em 1.75em .5em;
  border-radius: 0 0 1em 1em;
  color: white;
  line-height: 1.4;
  background: var(--blue);
}
.p-philosophy__image {
  width: var(--imgSize);
  margin: min(var(--cw) * 56 / var(--aspect), 56px) auto 0;
}
.p-philosophy__paragraph {
  --fontBasis: 18;
  margin-top: min(var(--cw) * 32 / var(--aspect), 32px);
}
@media (min-width: 768px) {
  .p-philosophy__image {
    position: relative;
    left: max(var(--cw) * -40 / var(--aspect), -40px);
  }
  .p-philosophy__paragraph {
    position: relative;
    left: max(var(--cw) * -20 / var(--aspect), -20px);
  }
  .p-philosophy__image {
    --imgBasis: 925;
  }
}
@media (max-width: 767.98px) {
  .p-philosophy {
    --outerLine: calc(var(--cw) * 8 / var(--aspect));
    --innerLine: calc(var(--cw) * 2 / var(--aspect));
    padding-inline: calc(var(--sidegap) * .5);
    padding-bottom: calc(var(--cw) * 72 / var(--aspect));
  }
  .p-philosophy__subject {
    --fontBasis: 16;
    padding: .5em 1.75em .6em;
    border-radius: 0 0 .75em .75em;
  }
  .p-philosophy__image {
    --imgBasis: 370;
    position: relative;
    left: -1.2%;
    margin-top: calc(var(--cw) * 48 / var(--aspect));
  }
  .p-philosophy__paragraph {
    --fontBasis: 16;
    margin-top: calc(var(--cw) * 32 / var(--aspect));
  }
}

/**
 * バナー
 * ---------------------------------------- */
.p-banners {
  --radius: 10px;
  position: relative;
  padding-top: min(var(--cw) * 80 / var(--aspect), 80px);
  padding-bottom: min(var(--cw) * 40 / var(--aspect), 40px);
  padding-inline: calc(var(--sidegap) * .7);
  background: white;
}
.c-pdflink {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  justify-content: center;
  column-gap: 1.5em;
  margin-inline: auto;
  border-radius: var(--radius);
  color: white;
  --fontBasis: 20;
  font-size: var(--fontSize);
  background: #23689b;
}
.c-pdflink__icon {
  position: relative;
  top: -.1em;
  width: .8em;
  height: auto;
  margin-left: .25em;
  fill: currentcolor;
  vertical-align: middle;
}
.c-pdflink__image {
  width: min(var(--cw) * 121 / var(--aspect), 121px);
}
.p-banners__list {
  display: flex;
}
.p-banners__list a {
  display: block;
  overflow: hidden;
  border: 1px solid var(--blue);
  border-radius: var(--radius);
}
.p-banners__list a * {
  border-radius: inherit;
}
@media (hover) {
  .c-pdflink {
    transition: background .1s;
  }
  .c-pdflink:hover {
    background: var(--blue);
  }
  .p-banners__list img {
    transition: scale .4s var(--easeOut);
  }
  .p-banners__list a:hover img {
    scale: 1.08;
    transition-duration: .3s;
  }
}
@media (min-width: 768px) {
  .c-pdflink {
    padding: min(var(--cw) * 28 / var(--aspect), 28px);
    width: min(var(--cw) * 581 / var(--aspect), 581px);
    text-align: center;
  }
  .p-banners__list {
    justify-content: space-between;
    max-width: min(var(--cw) * 960 / var(--aspect), 960px);
    margin: min(var(--cw) * 40 / var(--aspect), 40px) auto 0;
  }
  .p-banners__list a {
    width: min(var(--cw) * 304 / var(--aspect), 304px);
  }
}
@media (max-width: 767.98px) {
  .p-banners {
    padding-block: calc(var(--cw) * 64 / var(--aspect));
  }
  .c-pdflink {
    --fontBasis: 16;
    column-gap: 1.2em;
    padding: min(var(--cw) * 32 / var(--aspect)) min(var(--cw) * 24 / var(--aspect));
  }
  .c-pdflink__image {
    order: -1;
    width: calc(var(--cw) * 144 / var(--aspect));
  }
  .p-banners__list {
    flex-direction: column;
    row-gap: 1rem;
    margin-top: calc(var(--cw) * 32 / var(--aspect));
  }
  .p-banners__list img {
    aspect-ratio: 374 / 110;
    object-fit: cover;
  }
  .p-banners__list img[src*="bnr_story"] {
    object-position: 50% 52.5%;
  }
}

/**
 * モーダルコンテンツ
 * ---------------------------------------- */
.l-modal {
  z-index: 5;
  position: fixed;
  inset: 0;
}
.l-modal__overlay {
  z-index: -1;
  position: absolute;
  inset: 0;
  background: #fff1;
  backdrop-filter: blur(4px);
}
.l-modal__close {
  --size: 48px;
  --gap: min(var(--cw) * 48 / var(--aspect), 48px);
  display: grid;
  place-items: center;
  z-index: 2;
  position: fixed;
  top: var(--gap);
  right: calc(var(--gap) * 1.25);
  width: var(--size);
  height: var(--size);
  color: white;
  background: #23689b;
}
.l-modal__close > * {
  grid-area: 1 / 1;
}
.l-modal__close_bar {
  fill: none;
  stroke: currentcolor;
}
.l-modal__close_bar:first-child {
  rotate: 31deg;
}
.l-modal__close_bar:last-child {
  rotate: -31deg;
}
.l-modal__container {
  height: 100%;
  margin-left: auto;
  color: white;
  text-align: center;
  background: var(--blue);
  box-shadow: 0 -8px 24px #0004;
}
.l-modal__contents {
  --sidegap: min(var(--cw) * 155 / var(--aspect), 155px);
  z-index: 1;
  position: relative;
  overflow: hidden auto;
  overscroll-behavior: contain;
  height: 100%;
}
body.u-scrollbar .l-modal__contents {
  overflow-y: scroll;
}
@media (hover) {
  .l-modal__close {
    cursor: pointer;
  }
  .l-modal__close {
    transition: background .1s;
  }
  .l-modal__close:hover {
    background: var(--deepblue);
  }
}
@media (min-width: 768px) {
  .l-modal__container {
    width: min(var(--cw) * 1122 / var(--aspect), 1122px);
  }
}
@media (max-width: 767.98px) {
  .l-modal__close {
    --gap: calc(var(--cw) * 24 / var(--aspect));
  }
  .l-modal__container {
    width: calc(100% - var(--cw) * 28 / var(--aspect));
  }
  .l-modal__contents {
    --sidegap: calc(var(--cw) * 24 / var(--aspect));
  }
}
/* motion */
.l-modal:not(.is-active) {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.l-modal__close:not(.is-open),
.l-modal__overlay:not(.is-open),
.l-modal__container:not(.is-open),
.l-modal__container > *:not(.is-open) {
  opacity: 0;
}
.l-modal__close:not(.is-open) {
  transform: translateX(40px);
}
.l-modal__contents:not(.is-open) {
  transform: translateX(24px);
}
.l-modal__close:not(.is-open) .l-modal__close_bar {
  rotate: 0deg;
}
.l-modal__container:not(.is-open) {
  transform: translateX(100%);
}

.l-modal__close.is-anim,
.l-modal__contents.is-anim {
  transition: opacity .2s, transform .2s var(--easeOut);
  will-change: opacity, transform;
}
.l-modal__overlay.is-anim {
  transition: opacity .2s .2s;
  will-change: opacity;
}
.l-modal__close.is-anim .l-modal__close_bar {
  animation: barClose1 .2s .2s var(--easeOut) both;
}
.l-modal__close.is-anim .l-modal__close_bar:last-child {
  animation-name: barClose2;
}
.l-modal__container.is-anim {
  transition: opacity .2s .1s var(--easeOut), transform .2s .1s var(--easeOut);
}

.l-modal__overlay.is-anim.is-open {
  transition-delay: 0s;
}
.l-modal__close.is-anim.is-open,
.l-modal__contents.is-anim.is-open {
  transition-delay: .5s;
  transition-duration: .4s;
}
.l-modal__close.is-anim.is-open .l-modal__close_bar {
  animation-delay: .6s;
  animation-duration: .4s;
  animation-timing-function: var(--easeBack);
}
.l-modal__close.is-anim.is-open .l-modal__close_bar {
  animation-name: barOpen1;
}
.l-modal__close.is-anim.is-open .l-modal__close_bar:last-child {
  animation-name: barOpen2;
}
.l-modal__container.is-anim.is-open {
  transition-delay: .1s;
  transition-duration: .4s;
  transition-timing-function: ease, var(--easeInOut);
}
@keyframes barClose1 { from { rotate: 31deg; } to { rotate: 0deg; } }
@keyframes barClose2 { from { rotate: -31deg; } to { rotate: 0deg; } }
@keyframes barOpen1 { from { rotate: 0deg; } to { rotate: 31deg; } }
@keyframes barOpen2 { from { rotate: 0deg; } to { rotate: -31deg; } }

.c-article {
  padding: var(--space) var(--sidegap) calc(var(--space) * 1.25);
}
.c-article:not(.is-active) {
  display: none;
}
.c-article__lead {
  --fontBasis: 20;
  margin-top: 1.5em;
}
.c-article__subject2 {
  --fontBasis: 31;
}
.c-article__paragraph {
  --fontBasis: 20;
  margin-top: 1em;
}
.c-article__paragraph2 {
  --fontBasis: 22;
  margin-top: 1em;
}
.c-article__paragraph .c-marker::before,
.c-article__paragraph2 .c-marker::before {
  inset: .15em 0 .05em;
}
.c-article .c-marker::before {
  inset: .15em -.05em 0 -.05em;
  background: var(--dullred);;
}
.c-article__image {
  --border: min(var(--cw) * 20 / var(--aspect), 20px);
  position: relative;
  margin: min(var(--cw) * 40 / var(--aspect), 40px) auto 0;
}
.c-article__image > img {
  border: var(--border) solid #79a3c2;
  border-radius: calc(var(--border) * 1.538);
  background: #79a3c2;
}
.c-summary_before {
  margin-block: 4em;
}
.c-article .c-summary {
  margin-top: min(var(--cw) * 48 / var(--aspect), 48px);
  color: var(--blue);
}
.c-article .c-summary__title {
  background: var(--deepblue);
}
.c-article .c-summary-frame {
  border-color: var(--deepblue);
}
.c-article .c-summary-frame::before,
.c-article .c-summary-frame::after,
.c-article .c-summary-frameline {
  border-color: inherit;
}
.c-article .c-note {
  float: right;
  margin: .5em .5em 0 0;
  font-size: 1rem;
}
@media (min-width: 768px) {
  .c-article__image {
    --border: min(var(--cw) * 20 / var(--aspect), 20px);
    width: min(var(--cw) * 620 / var(--aspect), 620px);
  }
  .c-article__image figcaption {
    position: absolute;
    width: 9px;
    top: 9px;
    right: 101.5%;
  }
}
@media (max-width: 767.98px) {
  .c-article {
    padding-top: calc(var(--cw) * 96 / var(--aspect));
  }
  .c-article__lead {
    text-align: left;
  }
  .c-article__lead,
  .c-article__paragraph,
  .c-article__paragraph2 {
    --fontBasis: 16;
  }
  .c-article__image,
  .c-article .c-summary {
    margin-top: calc(var(--cw) * 32 / var(--aspect));
  }
  .c-article__image {
    --border: calc(var(--cw) * 8 / var(--aspect));
  }
  .c-article__image figcaption {
    display: none;
  }
}

.p-article2 .c-summary__list {
  --col: 5;
  --circleBasis: 135;
}
.p-article2 .c-summary__circle {
  --fontBasis: 16.29
}
.p-article2 .c-summary__item dd {
  --fontBasis: 13.01;
}
.p-article3 .c-summary__paragraph {
  letter-spacing: .01em;
}
.p-article4 .c-summary__subject {
  --fontBasis: 40;
}
.p-article4 .c-summary__paragraph {
  --fontBasis: 20.18;
  margin-top: .75em;
  letter-spacing: .01em;
}
@media (min-width: 768px) {
  .p-article1 .c-summary__list {
    --circleBasis: 162;
  }
  .p-article3 .c-summary_before {
    margin-inline: -.5em;
  }
  .p-article4 .c-summary__paragraph + .c-summary__paragraph {
    margin-top: .05em;
  }
}
@media (max-width: 767.98px) {
  .p-article1 .c-summary__list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1em;
  }
  .p-article1 .c-summary__item:first-child {
    margin-inline: 18%;
  }
  .p-article2 .c-summary {
    padding-bottom: min(var(--cw) * 56 / var(--aspect));
  }
  .p-article2 .c-summary__title {
    margin-bottom: min(var(--cw) * 36 / var(--aspect));
  }
  .p-article2 .c-summary__list {
    grid-template-columns: auto;
    row-gap: 1em;
  }
  .p-article2 .c-summary__item {
    display: flex;
    align-items: center;
    column-gap: 1em;
  }
  .p-article2 .c-summary__circle {
    --fontBasis: 16;
  }
  .p-article2 .c-summary__item dd {
    --fontBasis: 16;
    text-align: left;
  }
  .p-article3 .c-summary,
  .p-article4 .c-summary {
    padding-bottom: calc(var(--cw) * 80 / var(--aspect));
  }
  .p-article3 .c-summary__title,
  .p-article4 .c-summary__title {
    margin-bottom: calc(var(--cw) * 40 / var(--aspect));
  }
  .p-article4 .c-summary__subject {
    --fontBasis: 24;
    font-weight: 600;
  }
  .p-article4 .c-summary__paragraph {
    --fontBasis: 16;
  }
}

/**
 * 創業者・篠原欣子を突き動かしたものとは？
 * ---------------------------------------- */
.p-article1__problem {
  margin-top: min(var(--cw) * 48 / var(--aspect), 48px);
}
.p-article1__problem_subject {
  --fontBasis: 31;
  display: grid;
  grid-auto-flow: column;
  justify-content: center;
  position: relative;
}
.p-article1__problem_subject::before,
.p-article1__problem_subject::after {
  content: "";
  display: block;
  position: relative;
  width: .5em;
  height: 1em;
}
.p-article1__problem_subject::before {
  align-self: start;
  left: -.75em;
  border-top: 1px solid currentcolor;
  border-left: 1px solid currentcolor;
}
.p-article1__problem_subject::after {
  align-self: end;
  top: -.25em;
  right: -.75em;
  border-right: 1px solid currentcolor;
  border-bottom: 1px solid currentcolor;
}
.p-article1 .c-article__paragraph small {
  font-size: 1rem;
}
.p-article1__arrow {
  display: grid;
  align-items: center;
  height: 200px;
  margin-top: .5em;
  padding-bottom: 2.5em;
  line-height: 2;
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="60" viewBox="0 0 8 60" style="fill:none;stroke:%230d3c69;stroke-linecap:round;stroke-linejoin:round"><path stroke-dasharray="1 2" d="M4,.5v59"/><path d="M7.5,56l-3.5,3.5-3.5-3.5"/></svg>') center bottom / 64px auto no-repeat;
}
.p-article1__problem_item {
  --fontBasis: 15;
  display: grid;
  place-items: center;
  line-height: 1.6;
  /* もや */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" preserveAspectRatio="none" fill="%234880aa"><path d="M94.397,46.765c.329-6.642,7.715-13.951-.329-24.597-5.024-6.642-12.551-3.662-17.433-6.642-4.867-2.995-2.003-12.291-16.087-15.286-8.561-1.816-14.836,7.325-21.362,6.021-6.526-1.304-13.067-4.268-20.204,2.886-7.136,7.154-1.784,15.643-6.573,17.645C7.605,28.794-.69,33.9.046,42.994c.736,9.094,6.385,9.808,4.429,13.827-1.956,4.019-4.789,11.235.736,18.343,5.54,7.092,11.643,4.795,14.726,8.737,3.067,3.942,3.975,14.603,16.244,16.031,6.275.729,8.92-4.594,15.884-4.624,5.493-.016,13.834,6.3,24.57-1.676,7.293-5.431,3.302-12.337,6.37-15.627,4.021-4.314,12.363,1.428,16.416-10.972,2.754-8.396-5.212-16.543-5.024-20.267Z"/></svg>') center / 100% 100% no-repeat;
  filter: drop-shadow(0 8px 0 #004273);
}
.p-article1__problem_balloon {
  --fontBasis: 23;
  position: relative;
  margin-top: min(var(--cw) * 48 / var(--aspect), 48px);
  padding: .75em 1em 1em .5em;
  color: var(--blue);
  background: white;
}
.p-article1__problem_balloon strong {
  font-weight: inherit;
  font-size: 191%;
}
.p-article1__problem_balloon::after {
  content: "";
  position: absolute;
  bottom: calc(100% - 1px);
  left: calc(50% - .75em);
  width: 1.5em;
  height: 1em;
  background: inherit;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
@media (min-width: 768px) {
  .p-article1__problem_list {
    display: flex;
    margin-top: max(var(--cw) * -120 / var(--aspect), -120px);
  }
  .p-article1__problem_item {
    flex-grow: 1;
    width: 12em;
    height: 11em;
  }
  .p-article1__problem_item:nth-child(1) {
    margin-top: 1em;
  }
  .p-article1__problem_item:nth-child(2) {
    margin-top: 9em;
  }
  .p-article1__problem_item:nth-child(3) {
    margin-top: 8em;
    margin-left: 1.5em;
  }
}
@media (max-width: 767.98px) {
  .p-article1__problem {
    margin-top: calc(var(--cw) * 48 / var(--aspect));
  }
  .p-article1__problem_subject {
    --fontBasis: 18;
  }
  .p-article1__problem_subject::before,
  .p-article1__problem_subject::after {
    width: .75em;
    height: 1.5em;
  }
  .p-article1__problem_subject + .c-article__paragraph {
    margin-top: 2em;
  }
  .p-article1__arrow {
    height: 9em;
    margin-block: 2em;
    padding-bottom: 1em;
    background-size: 40px auto;
  }
  .p-article1__problem_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(var(--cw) * 10 / var(--aspect));
  }
  .p-article1__problem_item {
    --fontBasis: 16;
    width: 10.6em;
    height: 9.8em;
  }
  .p-article1__problem_item:nth-child(n+2) {
    padding-top: .25em;
  }
  .p-article1__problem_balloon {
    --fontBasis: 18;
    margin-top: calc(var(--cw) * 48 / var(--aspect));
    padding: 1em 1em 1em .5em;
  }
  .p-article1__problem_balloon strong {
    font-size: 120%;
  }
  .p-article1__problem .c-article__paragraph2 {
    margin-top: 4em;
  }
}

/* :::::: 経営理念が生まれた背景と想い :::::: */
.p-article1__content {
  margin-top: min(var(--cw) * 80 / var(--aspect), 80px);
}
.p-article1__subject {
  --fontBasis: 25;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  column-gap: 1em;
  line-height: 1.5;
}
.p-article1__subject::before,
.p-article1__subject::after {
  content: "";
  position: relative;
  top: .05em;
  width: 100%;
  height: .6em;
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="205" height="15" viewBox="0 0 205 15" style="fill:none;stroke:white"><path d="M0,.5h205M0,7.5h205M0,14.5h205"/></svg>') center / auto 100% repeat-x;
}
.p-article1__section {
  display: grid;
  margin-top: min(var(--cw) * 32 / var(--aspect), 32px);
}
.p-article1__label {
  --fontBasis: 42;
  padding: .5em;
  border-radius: 2em;
  line-height: 1.2;
  background: var(--deepblue);
}
.p-article1__image {
  justify-self: center;
  margin-top: max(var(--cw) * -16 / var(--aspect), -16px);
}
.p-article1__balloon {
  --fontBasis: 17;
  display: grid;
  place-items: center;
  position: relative;
  padding: 1.5em;
  color: var(--blue);
  text-align: left;
  background: white;
}
.p-article1__balloon::after {
  content: "";
  position: absolute;
  background: inherit;
}
@media (min-width: 768px) {
  .p-article1__section {
    grid-template-columns: auto 50%;
    column-gap: min(var(--cw) * 24 / var(--aspect), 24px);
    padding: min(var(--cw) * 10 / var(--aspect), 10px);
  }
  .p-article1__section:nth-of-type(even) {
    grid-template-columns: 50% auto;
  }
  .p-article1__label {
    grid-area: 1 / 1;
  }
  .p-article1__image {
    grid-area: 2 / 1;
  }
  .p-article1__image [width="620"] {
    width: min(var(--cw) * 310 / var(--aspect), 310px);
  }
  .p-article1__image [width="700"] {
    width: min(var(--cw) * 350 / var(--aspect), 350px);
  }
  .p-article1__image [width="680"] {
    width: min(var(--cw) * 340 / var(--aspect), 340px);
  }
  .p-article1__balloon {
    grid-row: 1 / 3;
    grid-column: 2;
    border-radius: min(var(--cw) * 48 / var(--aspect), 48px);
  }
  .p-article1__balloon::after {
    top: calc(50% - 1em);
    width: 1.5em;
    height: 2em;
    clip-path: polygon(100% 0, 100% 100%, 0 50%);
  }
  .p-article1__section:nth-of-type(even) .p-article1__label,
  .p-article1__section:nth-of-type(even) .p-article1__image {
    grid-column: 2;
  }
  .p-article1__section:nth-of-type(even) .p-article1__balloon {
    grid-column: 1;
  }
  .p-article1__section:nth-of-type(odd) .p-article1__balloon::after {
    right: calc(100% - 1px);
  }
  .p-article1__section:nth-of-type(even) .p-article1__balloon::after {
    left: calc(100% - 1px);
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  .p-article1__content + .c-article__paragraph2 {
    margin-top: min(var(--cw) * 40 / var(--aspect), 40px);
    line-height: 2;
  }
}
@media (max-width: 767.98px) {
  .p-article1__content {
    margin-top: calc(var(--cw) * 80 / var(--aspect));
  }
  .p-article1__subject {
    --fontBasis: 20;
  }
  .p-article1__section {
    margin-top: calc(var(--cw) * 32 / var(--aspect));
  }
  .p-article1__label {
    --fontBasis: 32;
    justify-self: center;
    width: 8em;
  }
  .p-article1__balloon {
    --fontBasis: 16;
    margin-top: 1.25em;
    border-radius: calc(var(--cw) * 24 / var(--aspect));
  }
  .p-article1__balloon::after {
    bottom: calc(100% - 1px);
    left: calc(50% - 1em);
    width: 2em;
    height: .75em;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }
  .p-article1__image [width="620"] {
    width: calc(var(--cw) * 272 / var(--aspect));
  }
  .p-article1__image [width="700"] {
    width: calc(var(--cw) * 288 / var(--aspect));
  }
  .p-article1__image [width="680"] {
    width: calc(var(--cw) * 295 / var(--aspect));
  }
}

/**
 * 行動指針にこめられた想いとは？
 * ---------------------------------------- */
.p-article2__content {
  margin-top: min(var(--cw) * 64 / var(--aspect), 64px);
}
.p-article2__section {
  padding: min(var(--cw) * 32 / var(--aspect), 32px);
  padding-bottom: min(var(--cw) * 44 / var(--aspect), 44px);
  color: var(--blue);
  background: white;
}
.p-article2__label {
  --fontBasis: 38;
  display: grid;
  line-height: 1.5;
}
.p-article2__section:nth-of-type(3) .p-article2__label {
  --fontBasis: 32;
  letter-spacing: -.2em;
}
.p-article2__label::before {
  content: "WHY";
  color: var(--red);
  font-size: 44%;
  letter-spacing: .17em;
}
.p-article2__section:nth-of-type(3) .p-article2__label::before {
  font-size: 52%;
}
.p-article2__paragraph {
  --fontBasis: 16;
  display: grid;
  justify-items: center;
  line-height: 1.8;
}
.p-article2__paragraph::before {
  content: "";
  dispaly: block;
  width: 2em;
  margin-top: 1em;
  padding-top: 1.25em;
  border-top: 1px solid currentcolor;
}
@media (min-width: 768px) {
  .p-article2__content::after {
    content: "";
    display: block;
    clear: both;
  }
  .p-article2__section {
    position: relative;
    width: min(var(--cw) * 399 / var(--aspect), 399px);
  }
  .p-article2__section:nth-of-type(1) {
    float: left;
    margin-left: min(var(--cw) * 19 / var(--aspect), 19px);
  }
  .p-article2__section:nth-of-type(2) {
    float: right;
    margin-right: max(var(--cw) * -39 / var(--aspect), -39px);
  }
  .p-article2__section:nth-of-type(3) {
    clear: left;
    float: left;
    margin-top:  max(var(--cw) * -24 / var(--aspect), -24px);
    margin-left: max(var(--cw) * -40 / var(--aspect), -40px);
  }
  .p-article2__section:nth-of-type(4) {
    z-index: 1;
    clear: right;
    float: right;
    margin-top:  max(var(--cw) * -16 / var(--aspect), -16px);
    margin-right: max(var(--cw) * -39 / var(--aspect), -39px);
  }
  .p-article2__section:nth-of-type(5) {
    float: left;
    margin-top: min(var(--cw) * 68 / var(--aspect), 68px);
    margin-left: min(var(--cw) * 19 / var(--aspect), 19px);
  }
  .p-article2__image {
    --r: 60;
    --w: 249;
    position: relative;
    width: min(var(--cw) * var(--w) / var(--aspect), var(--w) * 1px);
    border-radius: min(var(--cw) * var(--r) / var(--aspect), var(--r) * 1px);
    margin-top: min(var(--cw) * var(--mt, 0) / var(--aspect), var(--mt, 0) * 1px);
    margin-right: min(var(--cw) * var(--mr, 0) / var(--aspect), var(--mr, 0) * 1px);
    margin-bottom: min(var(--cw) * var(--mb, 0) / var(--aspect), var(--mb, 0) * 1px);
    margin-left: min(var(--cw) * var(--ml, 0) / var(--aspect), var(--ml, 0) * 1px);
  }
  .p-article2__image:nth-of-type(1) {
    --mt: 32; --mb: -8; --ml: -16;
    z-index: -1;
    float: left;
  }
  .p-article2__image:nth-of-type(2) {
    --w: 247;
    --mt: -16; --ml: -64;
    float: left;
  }
  .p-article2__image:nth-of-type(3) {
    --w: 194;
    --mr: -112;
    clear: right;
    float: right;
    margin-top: -3em;
  }
  .p-article2__image:nth-of-type(4) {
    --w: 260;
    --r: 87.09;
    --mt: -24; --ml: -32;
    float: left;
  }
  .p-article2__image * {
    width: 100%;
    border-radius: inherit;
  }
  .p-article2__content .c-article__paragraph2 {
    clear: both;
    margin: 0;
    padding-top: 2em;
  }
  .p-article2__paragraph {
    margin-inline: -.5em;
    white-space: nowrap;
  }
}
@media (max-width: 767.98px) {
  .p-article2__content {
    display: grid;
    margin-top: calc(var(--cw) * 40 / var(--aspect));
  }
  .p-article2__section:nth-of-type(5) {
    order: 1;
  }
  .p-article2 .c-article__paragraph2 {
    margin-block: 3em 4em;
  }
  .p-article2__label {
    --fontBasis: 28;
  }
  .p-article2__section:nth-of-type(3) .p-article2__label {
    --fontBasis: 26;
  }
  .p-article2__label::before {
    font-size: 50%;
  }
  .p-article2__paragraph {
    --fontBasis: 15;
    text-align: left;
  }
}

/**
 * そもそも“はたらくWell-being”ってなんだ？
 * ---------------------------------------- */
.p-article3__content {
  margin-top: min(var(--cw) * 80 / var(--aspect), 80px);
}
.p-article3__subject {
  --fontBasis: 50;
  position: relative;
  margin-top: .25em;
  line-height: 1.5;
}
.p-article3__subject::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  height: 3em;
  border-left: 1px dashed currentcolor;
}
@media (max-width: 767.98px) {
  .p-article3__subject {
    --fontBasis: 32;
  }
  .p-article3__subject::after {
    top: calc(100% + .25em);
    height: 5.3em;
  }
}

/* :::::: “はたらくWell-being” :::::: */
.p-article3__figure {
  display: grid;
  row-gap: min(var(--cw) * 160 / var(--aspect), 160px);
  margin-top: min(var(--cw) * 24 / var(--aspect), 24px);
  margin-inline: auto;
}
.p-article3__figure dt,
.p-article3__figure dd {
  display: grid;
  place-content: center;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}
.p-article3__figure-center {
  grid-area: 1 / 1 / 3 / 3;
  grid-template-rows: 2fr 1fr;
  place-self: center;
  width: 16em;
  height: 16em;
  color: var(--blue);
  background: white;
  box-shadow: 0 0 0 1.8em #598fb7, 0 0 0 4em #23689b;
}
.p-article3__figure-center_inner {
  --fontBasis: 21;
  grid-area: 1 / 1;
  display: grid;
  place-content: center;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.p-article3__figure-center_sub {
  font-size: 64%;
}
.p-article3__figure-center_image {
  grid-area: 1 / 1 / 3 / 2;
  display: grid;
  place-items: end center;
  aspect-ratio: 1 / 1;
  position: relative;
  bottom: 1.8em;
  left: -1.8em;
  width: calc(100% + 3.6em);
  clip-path: inset(0 round 50%);
}
.p-article3__figure-center_image img {
  width: min(var(--cw) * 347 / var(--aspect), 347px);
}
.p-article3__figure dd {
  --fontBasis: 15;
  row-gap: .5em;
  width: 12em;
  line-height: 1.5;
  background: #598fb7;
}
.p-article3__figure dd:nth-of-type(1) {
  grid-area: 1 / 1;
  place-self: start;
}
.p-article3__figure dd:nth-of-type(2) {
  grid-area: 1 / 2;
  place-self: start end;
}
.p-article3__figure dd:nth-of-type(3) {
  grid-area: 2 / 1;
  place-self: end start;
}
.p-article3__figure dd:nth-of-type(4) {
  grid-area: 2 / 2;
  place-self: end;
}
.p-article3__figure dd span:nth-of-type(2) {
  font-size: 1rem;
}
.p-article3__figure-center  {
  --fontBasis: 21;
}
@media (min-width: 768px) {
  .p-article3__figure {
    width: min(var(--cw) * 740 / var(--aspect), 740px);
  }
}
@media (max-width: 767.98px) {
  .p-article3__figure {
    row-gap: 86vw;
  }
  .p-article3__figure dt {
    --fontBasis: 20.07;
    width: 16em;
    box-shadow: 0 0 0 1.6em #598fb7, 0 0 0 3.8em #23689b;
  }
  .p-article3__figure-center {
    grid-template-rows: 2.5fr 1fr;
  }
  .p-article3__figure-center_inner {
    --fontBasis: 18;
    row-gap: .5em;
  }
  .p-article3__figure-center_sub {
    font-size: 72%;
  }
  .p-article3__figure dd {
    --fontBasis: 13;
    width: 10em;
  }
  .p-article3__figure-center_image {
    bottom: 1.6em;
    left: -1.6em;
    width: calc(100% + 3.2em);
  }
  .p-article3__figure-center_image img:not(.auto) {
    width: 80%;
  }
}
.p-article3__figure + .c-article__paragraph {
  position: relative;
  margin: 6.5em 0 4em;
}
.p-article3__figure + .c-article__paragraph::before {
  content: "";
  position: absolute;
  bottom: calc(100% + .5em);
  left: min(50% - var(--cw) * -12 / var(--aspect), 50% - 12px);
  aspect-ratio: 10 / 64;
  width: min(var(--cw) * 24 / var(--aspect), 24px);
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="28" viewBox="0 0 20 28" fill="white"><path d="M10,11L0,0h20s-10,11-10,11Z"/></svg>') center top / 100% auto repeat-y;
}
@media (max-width: 767.98px) {
  .p-article3__figure + .c-article__paragraph {
    margin-top: 4em;
  }
  .p-article3__figure + .c-article__paragraph::before {
    bottom: calc(100% + 2em);
    aspect-ratio: 10 / 48;
  }
}

/* :::::: 主観的な客観的な :::::: */
.p-article3__figure2 {
  margin-top: min(var(--cw) * 40 / var(--aspect), 40px);
}
.p-article3__figure2 li {
  --fontBasis: 14;
  display: grid;
  padding: 2.5em 2em 3em;
  border-radius: min(var(--cw) * 24 / var(--aspect), 24px);
  color: var(--blue);
  background: white;
}
.p-article3__figure2-side1 {
  box-shadow: 0 0 0 .8em #598fb7, 0 0 0 2em #23689b;
}
.p-article3__figure2-side2 {
  box-shadow: 0 0 0 .8em #598fb7;
}
.p-article3__figure2_subject {
  --fontBasis: 19;
  padding: 2.5em 0 .5em;
  font-size: var(--fontSize);
  line-height: 1.5;
  /* はてな */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="23" height="40" viewBox="0 0 23 40" fill="%23e4eef6"><path d="M10.46,27.84c-.818,0-1.227-.284-1.227-.853v-2.4c0-1.422.213-2.684.64-3.787.427-1.138.942-2.187,1.547-3.147.64-.96,1.262-1.92,1.867-2.88.64-.96,1.173-2.009,1.6-3.147.427-1.138.64-2.453.64-3.947s-.338-2.809-1.013-3.947c-.676-1.138-1.867-1.707-3.573-1.707-1.244,0-2.364.267-3.36.8-.996.498-1.493,1.28-1.493,2.347,0,.462.178.853.533,1.173.356.32.711.711,1.067,1.173.356.427.533,1.067.533,1.92,0,1.031-.338,1.92-1.013,2.667-.64.747-1.529,1.12-2.667,1.12s-2.116-.409-2.933-1.227c-.782-.818-1.173-1.938-1.173-3.36,0-1.493.444-2.898,1.333-4.213.924-1.316,2.222-2.382,3.893-3.2,1.707-.818,3.698-1.227,5.973-1.227,1.884,0,3.644.302,5.28.907,1.671.604,3.022,1.511,4.053,2.72,1.067,1.173,1.6,2.667,1.6,4.48,0,1.6-.373,3.022-1.12,4.267-.711,1.244-1.618,2.382-2.72,3.413-1.067,1.031-2.151,2.027-3.253,2.987-1.067.96-1.973,1.973-2.72,3.04-.711,1.067-1.067,2.276-1.067,3.627v1.547c0,.569-.409.853-1.227.853ZM10.887,40c-1.209,0-2.24-.409-3.093-1.227-.818-.853-1.227-1.884-1.227-3.093s.409-2.222,1.227-3.04c.853-.853,1.884-1.28,3.093-1.28s2.222.427,3.04,1.28c.853.818,1.28,1.831,1.28,3.04s-.427,2.24-1.28,3.093c-.818.818-1.831,1.227-3.04,1.227Z"/></svg>') center / auto 100% no-repeat;
}
.p-article3__figure2_subject strong {
  display: block;
  font-weight: inherit;
  font-size: 225%;
}
.p-article3__figure2_paragraph {
  margin-top: .5em;
  font-size: inherit;
}
.p-article3__figure2 + .c-article__paragraph {
  margin-top: 4em;
}
@media (min-width: 768px) {
  .p-article3__figure2 {
    display: flex;
    justify-content: space-between;
  }
  .p-article3__figure2 li {
    width: 45%;
  }
  .p-article3__figure2 + .c-article__paragraph {
    margin-right: -.5em;
  }
}
@media (max-width: 767.98px) {
  .p-article3__figure2 {
    display: grid;
    row-gap: calc(var(--cw) * 64 / var(--aspect));
    width: 84%;
    margin-inline: auto;
  }
  .p-article3__figure2 li,
  .p-article3__figure2_subject {
    --fontBasis: 16;
  }
}

/**
 * 「はたらいて、笑おう。」をかなえるには？
 * ---------------------------------------- */
.p-article4 {
  padding-bottom: 0;
}
.p-article4__content {
  margin-top: min(var(--cw) * 48 / var(--aspect), 48px);
  margin-inline: calc(var(--sidegap) * -1);
  padding: 0 var(--sidegap) calc(var(--space) * 1.25);
  background: #23689B;
}
.p-article4__content-image {
  width: min(var(--cw) * 722 / var(--aspect), 722px);
  margin: 1.5em auto 0;
}
@media (max-width: 767.98px) {
  .p-article4__content {
    margin-top: calc(var(--cw) * 48 / var(--aspect));
  }
  .p-article4__content-image {
    width: calc(var(--cw) * 352 / var(--aspect));
  }
}

/* :::::: そのために… :::::: */
.p-article4__content-intro {
  z-index: 0;
  position: relative;
  margin-inline: calc(var(--sidegap) * -1);
  background: var(--blue);
}
.p-article4__content-intro::before {
  content: "";
  z-index: -1;
  position: absolute;
  inset: 0 0 -1px;
  /* 山矢印 */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="1122" height="400" viewBox="0 0 1122 400" preserveAspectRatio="none" fill="%2323689B"><path d="M793.282,260.426c-78.646-46.436-181.245-93.48-181.281-179.894v-34.032h17.376L560.095,0l-69.282,46.5h19.188v33.893c0,.032,0,.061,0,.093,0,87.944-132.85,148.33-181.283,179.94C196.288,346.858,0,360.928,0,360.928v39.072h1122v-39.072s-201.565-25.425-328.718-100.502Z"/></svg>') center top / 100% 100% no-repeat;
}
.c-article4__forthat {
  --fontBasis: 14;
}
.c-article4__capsule {
  display: inline-block;
  width: 13em;
  padding: .75em;
  border-radius: 3em;
  color: var(--blue);
  font-weight: inherit;
  font-size: 135%;
  line-height: 1.2;
  background: #c1e2fa;
}
.p-article4__content-intro + .c-article__paragraph {
  margin-top: 3em;
}
.c-article4__concept {
  --fontBasis: 50;
  margin: .25em -.5em 0;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .c-article4__forthat {
    padding-top: min(var(--cw) * 48 / var(--aspect), 48px);
  }
  .c-article4__forthat + .c-article__paragraph {
    padding-top: min(var(--cw) * 64 / var(--aspect), 64px);
  }
  .c-article4__capsule {
    margin: .75em .2em;
  }
}
@media (max-width: 767.98px) {
  .p-article4__content-intro::before {
    background-size: 300% 125%;
  }
  .c-article4__forthat {
    --fontBasis: 16;
    padding-top: 3em;
  }
  .p-article4__content-intro .c-article__paragraph {
    --fontBasis: 20;
    margin-top: 2.5em;
  }
  .c-article4__capsule {
    margin: .5em .2em .15em;
    font-size: 120%;
  }
  .c-article4__capsule + .c-article4__capsule {
    margin: .15em .2em .5em;
  }
  .c-article4__concept {
    --fontBasis: 32;
    white-space: nowrap;
  }
}

/* :::::: 「はたらいて、笑おう。」をはかる3つの指標 :::::: */
.p-article4__index {
  margin-top: min(var(--cw) * 72 / var(--aspect), 72px);
  padding-inline: min(var(--cw) * 32 / var(--aspect), 32px);
  border-radius: min(var(--cw) * 30 / var(--aspect), 30px);
  background: var(--blue);
}
.p-article4__index_subject {
  --fontBasis: 20;
  position: relative;
  top: -1.4em;
  margin-inline: auto;
  padding: .5em 1.5em;
  border-radius: 2em;
  background: var(--deepblue);
}
.p-article4__index_paragraph {
  --fontBasis: 17;
}
.p-article4__index_lineup {
  display: grid;
  padding-block: min(var(--cw) * 48 / var(--aspect), 48px);
}
.p-article4__index_item dt {
  --fontBasis: 19;
}
.p-article4__index_item dt b {
  display: block;
  font-weight: inherit;
  font-size: 121%;
}
.p-article4__index_item dt::before {
  content: "";
  display: block;
  aspect-ratio: 46 / 59;
  width: 2.5em;
  height: auto;
  margin: 0 auto .25em;
  /* Q */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="59" viewBox="0 0 46 59" fill="%2323689b"><path d="M37.819,58.47c-2.003,0-3.614-.501-4.833-1.502-1.176-1.001-2.112-2.242-2.808-3.723-.697-1.48-1.285-2.917-1.763-4.311-1.872.522-3.897.784-6.074.784-4.311,0-8.099-1.001-11.364-3.004-3.222-2.003-5.747-4.833-7.576-8.49-1.785-3.657-2.678-7.968-2.678-12.931,0-4.92.958-9.209,2.874-12.866,1.916-3.701,4.506-6.553,7.772-8.556,3.266-2.046,6.923-3.07,10.972-3.07,3.004,0,5.813.588,8.425,1.763,2.656,1.132,4.963,2.787,6.923,4.964,2.003,2.133,3.549,4.702,4.637,7.707,1.132,3.004,1.698,6.357,1.698,10.058,0,4.31-.718,8.164-2.155,11.56-1.437,3.396-3.44,6.139-6.009,8.229.435,1.916,1.023,3.549,1.763,4.898.784,1.35,1.785,2.025,3.004,2.025.697,0,1.284-.109,1.763-.327.479-.218,1.067-.631,1.763-1.241.348-.305.631-.435.849-.392.261.087.457.196.588.326.218.218.305.414.261.588-.044.218-.087.435-.131.653-.044.087-.065.152-.065.196-.697,2.003-1.698,3.614-3.004,4.833-1.263,1.219-2.874,1.829-4.833,1.829ZM14.176,43.645c.479.566.718.762.718.588,0-.218-.043-.588-.131-1.11-.087-.305-.174-.653-.261-1.045-.087-.392-.131-.74-.131-1.045,0-1.35.326-2.591.98-3.723.653-1.176,1.546-2.112,2.678-2.808,1.132-.74,2.395-1.11,3.788-1.11,2.83,0,5.116.588,6.858,1.763,1.742,1.176,3.157,2.569,4.245,4.18,1.176-3.527,1.763-8.207,1.763-14.042,0-5.53-.544-9.905-1.633-13.127-1.088-3.266-2.569-5.595-4.441-6.988-1.829-1.393-3.919-2.09-6.27-2.09s-4.463.697-6.335,2.09c-1.829,1.393-3.287,3.723-4.376,6.988-1.089,3.222-1.633,7.598-1.633,13.127,0,4.528.348,8.338,1.045,11.429.74,3.048,1.785,5.355,3.135,6.923ZM22.275,47.302c1.001,0,1.938-.131,2.808-.392.871-.261,1.72-.61,2.547-1.045-.305-1.611-.653-3.157-1.045-4.637-.348-1.48-.871-2.7-1.567-3.657-.697-.958-1.698-1.437-3.004-1.437-1.611,0-2.917.479-3.919,1.437-.958.914-1.437,2.133-1.437,3.657,0,.827.174,1.72.523,2.678.392.914,1.001,1.72,1.829,2.417.827.653,1.916.98,3.266.98Z"/></svg>') center / contain no-repeat;
}
.p-article4__index_item dd {
  --fontBasis: 14;
  margin-top: .75em;
  padding-bottom: 2em;
}
.p-article4__result {
  --fontBasis: 29;
  line-height: 2;
}
.p-article4__result_yes {
  z-index: 0;
  position: relative;
  padding: 1.5em .8em 2em 1em;
  color: var(--blue);
}
.p-article4__result_yes::before {
  content: "";
  z-index: -1;
  position: absolute;
  inset: 0;
  /* YES! の吹き出し */
  background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" preserveAspectRatio="none" fill="white"><path d="M85.955,33.955C90.021,27.893,89.152-.884,42.651.021-3.85.94-.652,35.176,8.348,42.446c-16.856,12.125-6.395,31.205,15.408,38.776,16.645,5.788,33.422,7.27,39.817,11.207-1.75-3.032-6.395-6.364-3.197-5.46,6.224,1.77,14.527,8.792,22.093,13.031-10.461-9.396-22.382-20.602-11.922-22.125,10.461-1.509,27.908-1.509,29.356-19.697,1.461-18.161-13.947-24.223-13.947-24.223Z"/></svg>') center / 100% 100% no-repeat;
}
@media (min-width: 768px) {
  .p-article4__index {
    margin-inline: max(var(--cw) * -8 / var(--aspect), -8px);
  }
  .p-article4__index_subject {
    width: fit-content;
  }
  .p-article4__index_lineup {
    grid-template-columns: repeat(3, 1fr);
  }
  .p-article4__index_item:nth-child(2n) {
    border-right: 1px dashed #79a3c2;
    border-left: 1px dashed #79a3c2;
  }
  .p-article4__result {
    margin-top: 2em;
  }
  .p-article4__result + .p-article4__result {
    margin-top: 0;
  }
  .p-article4__result_yes {
    top: -1.5em;
  }
}
@media (max-width: 767.98px) {
  .p-article4__index {
    margin-top: calc(var(--cw) * 104 / var(--aspect));
    padding-inline: calc(var(--cw) * 24 / var(--aspect));
    border-radius: 0 0 calc(var(--cw) * 32 / var(--aspect)) calc(var(--cw) * 32 / var(--aspect));
  }
  .p-article4__index_subject {
    margin-inline: calc(var(--cw) * -24 / var(--aspect));
    padding: .75em 1.5em;
    border-radius: calc(var(--cw) * 32 / var(--aspect)) calc(var(--cw) * 32 / var(--aspect)) 0 0;
    line-height: 1.5;
  }
  .p-article4__index_paragraph {
    --fontBasis: 16;
    text-align: left;
  }
  .p-article4__index_lineup {
    margin-top: calc(var(--cw) * 32 / var(--aspect));
    padding-top: 0;
    border-top: 1px solid #79a3c2;
  }
  .p-article4__index_item:nth-child(2n) {
    border-top: 1px dashed #79a3c2;
    border-bottom: 1px dashed #79a3c2;
  }
  .p-article4__index_item dt {
    --fontBasis: 20;
    padding-top: 1.5em;
    line-height: 1.5;
  }
  .p-article4__index_item dt::before {
    width: 1.5em;
  }
  .p-article4__index_item dd {
    --fontBasis: 16;
  }
  .p-article4__index_item:last-child dd {
    padding-bottom: 0;
  }
  .p-article4__result {
    --fontBasis: 20;
    margin-top: 3em;
  }
  .p-article4__result + .p-article4__result {
    --fontBasis: 20;
    margin-block: 1em 3em;
  }
  .p-article4__result_yes {
    display: inline-block;
    top: .25em;
    padding: 1.25em 1em 1.75em 1.2em;
  }
}

/**
 * Utility / Common
 * ---------------------------------------- */
.u-visuallyhidden {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  clip-path: inset(50%);
  opacity: 0;
}
@media (min-width: 768px) {
  .u-sponly { display: none; }
}
@media (max-width: 767.98px) {
  .u-pconly { display: none; }
}
body.is-fixed {
  position: fixed;
  inset: 0;
}
body.u-scrollbar {
  overflow-y: scroll;
}
html {
  -webkit-text-size-adjust: 100%;
}
:root {
  --red: #b50008;
  --palered: #ffd0cd;
  --dullred: #c74634;
  --blue: #094f83;
  --deepblue: #0d3c69;
  /* weight 500, 700 */
  --font: "Sorts Mill Goudy", "Shippori Mincho", serif;
  --fontJa: "Shippori Mincho", serif;
  /* weight 400 */
  --fontEn: "Sorts Mill Goudy", serif;
  
  --easeIn: cubic-bezier(.3,0,.7,0);
  --easeOut: cubic-bezier(.3,1,.7,1);
  --easeInOut: cubic-bezier(.7,0,.3,1);
  --easeBack: cubic-bezier(.3,1.6,.7,1);
  
  --arrowUp: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="60" viewBox="0 0 8 60" style="fill:none;stroke:%23094f83;stroke-linecap:round;stroke-linejoin:round"><path stroke-dasharray="1 2" d="M4,59.5V.5"/><path d="M.5,4L4,.5l3.5,3.5"/></svg>');
  --arrowDn: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="60" viewBox="0 0 8 60" style="fill:none;stroke:%23094f83;stroke-linecap:round;stroke-linejoin:round"><path stroke-dasharray="1 2" d="M4,.5v59"/><path d="M7.5,56l-3.5,3.5-3.5-3.5"/></svg>');
}