@charset "utf-8";
/* ====================================================
TOP home.css
・PC基準 1366px / SP基準 375px
・ブレークポイント：max-width 1024px（TAB）/ max-width 767px（SP）
==================================================== */

/* ====================================================
スクロールアニメーション .js-animation .scr
※ script.js（common）で .scr-on を付与。common.css に移すべき
==================================================== */
.scr {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.8s ease,
    transform 0.8s ease;
}
.scr.scr-on {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .scr {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ====================================================
セクション見出し .sec-ttl
==================================================== */
.sec-ttl {
  font-size: var(--fs34);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.03em;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .sec-ttl {
    font-size: var(--fs26);
    line-height: 1.65;
    letter-spacing: 0.04em;
  }
}

/* ====================================================
吹き出し見出し .balloon-ttl（色：pink / green）
※ 他ページで使う場合は common.css に移すべき
==================================================== */
.balloon-ttl {
  position: relative;
  z-index: 2;
  width: fit-content;
  margin: 0 auto;
  padding: 26px 40px;
  border-radius: 30px;
  background-color: #f25f95;
  font-size: var(--fs32);
  font-weight: 700;
  line-height: 1.43;
  letter-spacing: 0.03em;
  color: #fff;
  text-align: center;
  filter: drop-shadow(5px 5px 0 #fff);
}
.balloon-ttl::after {
  position: absolute;
  bottom: -21px;
  left: 50%;
  width: 30px;
  height: 22px;
  background-color: inherit;
  content: "";
  transform: translateX(-50%);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.balloon-ttl.green {
  padding: 33px 46px;
  background-color: #4bb23d;
}
.balloon-ttl.pink span {
  font-size: var(--fs26);
  display: block;
}
@media screen and (max-width: 767px) {
  .balloon-ttl {
    padding: 12px 18px 15px;
    border-radius: 20px;
    font-size: var(--fs22);
    line-height: 1.4;
    filter: drop-shadow(4px 4px 0 #fff);
  }
  .balloon-ttl::after {
    bottom: -13px;
    width: 20px;
    height: 14px;
  }
  .balloon-ttl.green {
    padding: 22px 10px;
    letter-spacing: 0.1em;
  }
  .balloon-ttl.pink {
    padding: 11px 20px 17px;
    letter-spacing: 0.05em;
  }
  .balloon-ttl.pink span {
    margin-top: 4px;
    font-size: var(--fs18);
    letter-spacing: 0.08em;
  }
}

/* ====================================================
矢印ボタン .arrow-btn（色：green / orange / lpink / blue、サイズ：small）
※ 白丸＋矢印はCSSで描画。他ページで使う場合は common.css に移すべき
==================================================== */
.arrow-btn {
  position: relative;
  display: flex;
  align-items: center;
  width: 308px;
  max-width: 100%;
  height: 66px;
  padding: 0 70px 0 36px;
  border-radius: 33px;
  background-color: #4bb23d;
  font-size: var(--fs17);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
  color: #fff;
}
.arrow-btn::before {
  position: absolute;
  top: 50%;
  right: 23px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #fff;
  content: "";
  transform: translateY(-50%);
}
.arrow-btn::after {
  position: absolute;
  top: 50%;
  right: 36px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #4bb23d;
  border-right: 2px solid #4bb23d;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}
.arrow-btn.orange {
  background-color: #f57d03;
}
.arrow-btn.orange::after {
  border-color: #f57d03;
}
.arrow-btn.lpink {
  background-color: #fc89b3;
}
.arrow-btn.lpink::after {
  border-color: #fc89b3;
}
.arrow-btn.blue {
  background-color: #3abde8;
}
.arrow-btn.blue::after {
  border-color: #3abde8;
}
.arrow-btn.small {
  justify-content: center;
  width: 244px;
  height: 44px;
  padding: 0 44px 0 20px;
  border-radius: 22px;
  font-size: var(--fs16);
}
.arrow-btn.small::before {
  right: 18px;
  width: 24px;
  height: 24px;
}
.arrow-btn.small::after {
  right: 28px;
  width: 5px;
  height: 5px;
}
.arrow-btn:focus-visible {
  outline: 2px solid #262626;
  outline-offset: 3px;
}
@media screen and (max-width: 767px) {
  .arrow-btn {
    height: 58px;
    padding: 0 60px 0 32px;
    border-radius: 29px;
  }
  .arrow-btn::before {
    right: 26px;
    width: 24px;
    height: 24px;
  }
  .arrow-btn::after {
    right: 36px;
    width: 6px;
    height: 6px;
  }
}

/* ====================================================
FV .fv-area
==================================================== */
.contents-area.fv-area {
  overflow: hidden;
  height: 100vh;
  min-height: 560px;
}
.contents-area.fv-area .fv-slider,
.contents-area.fv-area .fv-slide-list {
  position: absolute;
  inset: 0;
}
.contents-area.fv-area .fv-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.6s ease;
}
.contents-area.fv-area .fv-slide.is-active {
  opacity: 1;
}
.contents-area.fv-area .fv-slide img {
  width: 100%;
  height: 100%;

  object-fit: cover;
}
.contents-area.fv-area .fv-box {
  position: absolute;
  bottom: 3vw; /* 98 */
  left: 7.247438vw; /* 99 */
  z-index: 1;
}
.contents-area.fv-area .fv-ttl {
  width: 42vw;
  max-width: 584px;
  margin-bottom: 1.6vw;
  position: relative;
}
.contents-area.fv-area .fv-ttl:before {
  content: "";
  background: url(../img/home/home_fv_catch_bg.png) center / 100%;
  aspect-ratio: 717 / 306;
  width: 717px;
  top: -20px;
  left: 0;
  position: absolute;
  z-index: -1;
}
.contents-area.fv-area .fv-lead {
  display: inline-block;
  padding: 0 30px;
  border-radius: 23px;
  background-color: #4bb23d;
  font-size: var(--fs24);
  font-weight: 700;
  line-height: 46px;
  letter-spacing: 0.1em;
  color: #fff;
}
.contents-area.fv-area .fv-badge {
  position: absolute;
  right: 3.221083vw; /* 44 */
  bottom: 3vw; /* 78 */
  z-index: 1;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  --badge-w: clamp(150px, 15.666179vw, 240px); /* 214 */
  width: var(--badge-w);
  padding: 0 0 20px;
  background: url(../img/home/fv_badge_bg.svg) no-repeat center / contain;
  font-size: clamp(1.6rem, 1.756955vw, 2.6rem); /* 24 */
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  color: #fff;
  text-align: center;

  aspect-ratio: 214 / 218;
  gap: 0.6em;
}
.contents-area.fv-area .fv-badge-icon {
  width: 1.1em;
  line-height: 1;
}
.contents-area.fv-area .fv-badge-icon img {
  display: block;
}
/* 字間の末尾ぶんを相殺して左右中央に */
.contents-area.fv-area .fv-badge-txt {
  margin-right: -0.1em;
}
.contents-area.fv-area .fv-badge:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

/* 右側の固定ボタン（スタイルは common.css）
   TOPのみ、FVが画面から出たら js/home.js で .is-show を付与。
   表示の動きはスクロールアニメーション（.scr）と同じ：下から30pxふわっと 0.8s */
.fix-banner {
  visibility: hidden;
  opacity: 0;
  transform: translateY(30px);
  pointer-events: none;
  transition:
    opacity 0.8s ease,
    transform 0.8s ease,
    visibility 0.8s ease;
}
.fix-banner.is-show {
  visibility: visible;
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
@media (prefers-reduced-motion: reduce) {
  .fix-banner {
    transform: none;
    transition: none;
  }
}

/* SP下部の固定ボタン（スタイルは common.css）
   TOPのみ、FVが画面から出たら js/home.js で .is-show を付与。
   画面下から押し上がるように表示 */
@media screen and (max-width: 767px) {
  .fix-bottom-banner {
    visibility: hidden;
    opacity: 0;
    transform: translateY(100%);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      transform 0.5s ease,
      visibility 0.5s ease;
  }
  .fix-bottom-banner.is-show {
    visibility: visible;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
}
@media screen and (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .fix-bottom-banner {
    transform: none;
    transition: none;
  }
}

@media screen and (max-width: 767px) {
  .contents-area.fv-area {
    height: 180vw; /* 675 / 375 */
    min-height: 0;
  }
  .contents-area.fv-area .fv-box {
    bottom: 14.5vw;
    left: 6.4%;
  }
  .contents-area.fv-area .fv-ttl {
    width: 88vw; /* 308 */
    max-width: none;
    margin-bottom: 3.8vw; /* 33 */
  }
  .contents-area.fv-area .fv-ttl:before {
    aspect-ratio: 717 / 306;
    width: 100%;
    top: -10px;
    left: 0;
    position: absolute;
    z-index: -1;
  }
  .contents-area.fv-area .fv-lead {
    padding: 10px 28px;
    border-radius: 60px;
    font-size: var(--fs16);
    line-height: 1.5;
    letter-spacing: 0.1em;
  }
  /* 下部固定バナーの高さをSPカンプ（44px）に合わせる ※common.css に移すべき */
  .fix-bottom-banner a {
    padding: 11px 0;
  }
  /* SPカンプに空き状況バッジなし */
  .contents-area.fv-area .fv-badge {
    display: none;
  }
}

/* ====================================================
リックキッズなら .concept-area
==================================================== */
.contents-area.concept-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  overflow-x: clip;
  padding: 64px 0 100px;
}
.contents-area.concept-area .concept-box {
  flex: 1;
  min-width: 0;
  max-width: 470px;
  margin-left: max(40px, calc(50% - 600px));
  padding-right: 3vw;
}
.contents-area.concept-area .concept-sub {
  font-size: var(--fs20);
  font-weight: 700;
  letter-spacing: 0.15em;
}
.contents-area.concept-area .concept-ttl {
  margin-top: 10px;
  font-size: var(--fs43);
  font-weight: 700;
  line-height: 1.58;
  letter-spacing: 0.15em;
}
.contents-area.concept-area .concept-ttl span {
  font-size: var(--fs47);
}
.contents-area.concept-area .concept-ttl .pink {
  color: #f25f95;
}
.contents-area.concept-area .concept-ttl .green {
  color: #4bb23d;
}
.contents-area.concept-area .concept-txt {
  max-width: 365px;
  margin-top: 38px;
  font-size: var(--fs15);
  line-height: 1.87;
  letter-spacing: 0.08em;
}
.contents-area.concept-area .green-btn {
  margin-top: 50px;
}
.contents-area.concept-area .green-btn a {
  margin-right: auto;
  margin-left: 0;
  margin-top: 50px;
}

.contents-area.concept-area .concept-img {
  flex-shrink: 0;
  width: calc(50% + min(10.322108vw, 141px));
}
.contents-area.concept-area .concept-img-inner {
  position: relative;
  width: min(60.322108vw, 824px);

  aspect-ratio: 824 / 598;
}
.contents-area.concept-area .concept-img-inner figure,
.contents-area.concept-area .concept-img-bg {
  position: absolute;
}
.contents-area.concept-area .concept-img-inner figure {
  overflow: hidden;
  border-radius: 28px;
}
.contents-area.concept-area .concept-img-inner figure img {
  width: 100%;
  height: 100%;

  object-fit: cover;
}
.contents-area.concept-area .concept-img-bg {
  top: 20.401338%; /* 122 */
  right: -50vw;
  left: 20.145631%; /* 166 */
  height: 74.247492%; /* 444 */
  background-color: #5ec750;
}
.contents-area.concept-area .concept-img-01 {
  top: 0;
  left: 0;
  width: 50.849515%; /* 419 */
  height: 53.846154%; /* 322 */
}
.contents-area.concept-area .concept-img-02 {
  top: 32.107023%; /* 192 */
  left: 45.752427%; /* 377 */
  width: 44.174757%; /* 364 */
  height: 44.314381%; /* 265 */
}
.contents-area.concept-area .concept-img-03 {
  top: 59.364548%; /* 355 */
  left: 12.5%; /* 103 */
  width: 41.383495%; /* 341 */
  height: 40.635452%; /* 243 */
}
.contents-area.concept-area .concept-img .scr {
  transform: translateY(30px) scale(0.94);
}
.contents-area.concept-area .concept-img .scr.scr-on {
  transform: none;
}

@media screen and (max-width: 1024px) {
  .contents-area.concept-area .concept-btn {
    margin-top: 45px;
  }
  .contents-area.concept-area .concept-btn .arrow-btn {
    width: 260px;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.concept-area {
    display: block;
    padding: 41px 0 29px;
  }
  .contents-area.concept-area .concept-box {
    max-width: none;
    margin: 0;
    padding: 0 11.466667%; /* 43 */
  }
  .contents-area.concept-area .concept-sub,
  .contents-area.concept-area .concept-ttl {
    text-align: center;
  }
  .contents-area.concept-area .concept-sub {
    font-size: var(--fs16);
    letter-spacing: 0.06em;
  }
  .contents-area.concept-area .concept-ttl {
    margin-top: 5px;
    font-size: var(--fs32);
    line-height: 1.5;
    letter-spacing: 0.14em;
  }
  .contents-area.concept-area .concept-ttl span {
    font-size: var(--fs35);
  }
  .contents-area.concept-area .concept-txt {
    max-width: none;
    margin-top: 24px;
    padding: 0 6px;
    letter-spacing: 0.02em;
  }
  .contents-area.concept-area .green-btn {
    margin-top: 20px;
  }
  .contents-area.concept-area .green-btn a {
    margin-top: 0;
  }

  /* 写真3枚（375×295 基準の％） */
  .contents-area.concept-area .concept-img {
    width: 100%;
    margin-top: 31px;
  }
  .contents-area.concept-area .concept-img-inner {
    width: 100%;

    aspect-ratio: 375 / 295;
  }
  .contents-area.concept-area .concept-img-bg {
    display: none;
  }
  .contents-area.concept-area .concept-img-01 {
    top: 0;
    left: 47.733333%; /* 179 */
    width: 52.266667%; /* 196 */
    height: 61.016949%; /* 180 */
    border-radius: 40px 0 0 40px !important;
  }
  .contents-area.concept-area .concept-img-02 {
    top: 13.898305%; /* 41 */
    left: 0;
    width: 42.666667%; /* 160 */
    height: 45.084746%; /* 133 */
    border: none;
    border-radius: 0 40px 40px 0 !important;
  }
  .contents-area.concept-area .concept-img-03 {
    top: 63.389831%; /* 187 */
    left: 20%; /* 75 */
    width: 36.533333%; /* 137 */
    height: 36.610169%; /* 108 */
    border-radius: 40px;
  }
}

/* ====================================================
リックキッズってどんなところ？ .feature-area
==================================================== */
.contents-area.feature-area .feature-bg {
  padding-bottom: 57px;
  background: linear-gradient(transparent 38px, #f3f2f0 38px);
}
.contents-area.feature-area .feature-list {
  display: grid;
  width: min(1232px, calc(100% - 80px));
  margin: 50px auto 0;

  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}
.contents-area.feature-area .feature-box {
  display: flex;
  flex-direction: column;
  padding: 11px 11px 22px;
  border-radius: 30px;
  background-color: #fff;
}
.contents-area.feature-area .feature-img {
  overflow: hidden;
  border-radius: 25px;

  aspect-ratio: 268 / 195;
}
.contents-area.feature-area .feature-img img {
  height: 100%;

  object-fit: cover;
}
.contents-area.feature-area .feature-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding-top: 18px;
}
.contents-area.feature-area .feature-ttl {
  font-size: var(--fs30);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-align: center;
}
.contents-area.feature-area .feature-ttl-sub {
  display: block;
  margin-bottom: 2px;
  font-size: var(--fs16);
  line-height: 1.5;
  letter-spacing: 0.08em;
}
.contents-area.feature-area .feature-ttl .num {
  font-size: 1.25em;
  line-height: 1;
  letter-spacing: 0.04em;
}
.contents-area.feature-area .feature-txt {
  margin-top: 26px;
  padding: 0 28px;
  font-size: var(--fs15);
  line-height: 1.87;
  letter-spacing: 0.05em;
}
.contents-area.feature-area .feature-btn {
  margin-top: auto;
  padding-top: 20px;
}
.contents-area.feature-area .feature-btn .arrow-btn {
  margin: 0 auto;
}
.contents-area.feature-area .feature-box.transfer .feature-ttl {
  color: #4bb23d;
}
.contents-area.feature-area .feature-box.time .feature-ttl {
  color: #f57d03;
}
.contents-area.feature-area .feature-box.plan .feature-ttl {
  color: #fc89b3;
}
.contents-area.feature-area .feature-box.meal .feature-ttl {
  color: #3ba8e1;
}

/* 説明会CTA：フッター（.app-area）と同じボタン画像を使用。下地のグレーは画像の途中で切り替え */
.contents-area.feature-area .feature-cta {
  padding: 0 40px;
  background: linear-gradient(#f3f2f0 64%, transparent 64%);
}
.contents-area.feature-area .feature-cta-btn {
  display: block;
  width: 100%;
  max-width: 663.66px;
  margin: 0 auto;
}
.contents-area.feature-area .feature-cta-btn img {
  width: 100%;
  vertical-align: bottom;
}

@media screen and (max-width: 1024px) {
  .contents-area.feature-area .feature-list {
    grid-template-columns: repeat(2, 1fr);
    max-width: 640px;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.feature-area .feature-bg {
    padding-bottom: 20px;
    background: linear-gradient(transparent 64px, #f3f2f0 64px);
  }
  .contents-area.feature-area .feature-list {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: none;
    margin-top: 32px;
    padding: 0 6.133333%; /* 23 */

    gap: 10px;
  }

  /* SPは横並びカード。ボタンはカード全体のリンク＋見出し横の丸矢印に */
  .contents-area.feature-area .feature-box {
    position: relative;
    display: grid;
    align-items: center;
    padding: 18px 8px 18px 16px;
    border-radius: 20px;

    grid-template-columns: 106px 1fr;
    gap: 14px;
  }
  .contents-area.feature-area .feature-img {
    border-radius: 12px;

    aspect-ratio: 1 / 1;
  }
  .contents-area.feature-area .feature-body {
    display: block;
    padding-top: 0;
  }
  .contents-area.feature-area .feature-ttl {
    font-size: var(--fs24);
    line-height: 1.35;
    letter-spacing: 0.05em;
    text-align: left;
    white-space: nowrap;
    position: relative;
  }
  .contents-area.feature-area .feature-ttl:before {
    content: "";
    position: absolute;
    right: 4px;
    bottom: 4px;
    width: 22px;
    height: 23px;
  }
  .contents-area.feature-area .feature-box.transfer .feature-ttl:before {
    background: url(../img/common/cmm_maru_arrow_bggreen.svg) no-repeat center / 100%;
  }
  .contents-area.feature-area .feature-box.time .feature-ttl:before {
    background: url(../img/common/cmm_maru_arrow_bgorange.svg) no-repeat center / 100%;
  }
  .contents-area.feature-area .feature-box.plan .feature-ttl:before {
    background: url(../img/common/cmm_maru_arrow_bgpink.svg) no-repeat center / 100%;
  }
  .contents-area.feature-area .feature-box.meal .feature-ttl:before {
    background: url(../img/common/cmm_maru_arrow_bgblue.svg) no-repeat center / 100%;
  }
  .contents-area.feature-area .feature-ttl-sub {
    margin-bottom: 2px;
    white-space: normal;
    font-size: var(--fs14);
    letter-spacing: 0.03em;
  }
  /* 「最長22時まで」：最長・時まではひと回り小さく、数字を大きく */
  .contents-area.feature-area .feature-box.time .feature-ttl {
    font-size: var(--fs20);
  }
  .contents-area.feature-area .feature-box.time .feature-ttl .num {
    margin: 0 0.2em 0 0.25em;
    font-size: var(--fs32);
    letter-spacing: 0;
  }
  .contents-area.feature-area .feature-ttl .num {
    margin: 0 0.2em;
    font-size: 1.2em;
  }
  .contents-area.feature-area .feature-txt {
    margin-top: 8px;
    padding: 0 0 0 4px;
    font-size: var(--fs13);
    line-height: 1.7;
    letter-spacing: 0.06em;
  }
  .contents-area.feature-area .feature-btn {
    margin: 0;
    padding: 0;
  }
  .contents-area.feature-area .feature-btn .arrow-btn {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border-radius: 20px;
    background-color: transparent;
    font-size: 0;
    color: transparent;
  }
  .contents-area.feature-area .feature-btn .arrow-btn::before {
    content: none;
    /* top: 50px;
    right: 23px;
    width: 22px;
    height: 22px;
    transform: none; */
  }
  .contents-area.feature-area .feature-btn .arrow-btn::after {
    content: none;
    /* top: 61px;
    right: 32px;
    width: 6px;
    height: 6px;
    border-color: #fff; */
  }
  .contents-area.feature-area .feature-box.transfer .arrow-btn::before {
    background-color: #4bb23d;
  }
  .contents-area.feature-area .feature-box.time .arrow-btn::before {
    background-color: #f57d03;
  }
  .contents-area.feature-area .feature-box.plan .arrow-btn::before {
    background-color: #fc89b3;
  }
  .contents-area.feature-area .feature-box.meal .arrow-btn::before {
    background-color: #3abde8;
  }

  /* 説明会CTA（フッター .app-area のSP幅に合わせる） */
  .contents-area.feature-area .feature-cta {
    padding: 0;
    background: linear-gradient(#f3f2f0 68%, transparent 68%);
  }
  .contents-area.feature-area .feature-cta-btn {
    width: 83.216vw;
    max-width: 312px;
  }
}

/* ====================================================
リックキッズの豊富なプログラム .program-area
==================================================== */
.contents-area.program-area {
  padding: 76px 0 118px;
}
.contents-area.program-area .program-logo {
  width: 206px;
  margin: 0 auto;
}
.contents-area.program-area .sec-ttl {
  margin-top: 22px;
}
.contents-area.program-area .program-lead {
  margin-top: 38px;
  font-size: var(--fs18);
  line-height: 2.13;
  letter-spacing: 0.08em;
  text-align: center;
}
.contents-area.program-area .program-list {
  margin-top: 20px;
}
.contents-area.program-area .program-box {
  position: relative;
  padding-top: 52px;
}
.contents-area.program-area .program-label {
  position: absolute;
  top: 0;
  left: calc(max(40px, 50% - 600px) + 80px);
  z-index: 2;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  width: 185px;
  height: 137px;
  border-radius: 30px;
  background-color: #4bb23d;
  font-size: var(--fs38);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.05em;
  color: #fff;
  filter: drop-shadow(5px 5px 0 #fff);
}
.contents-area.program-area .program-label::after {
  position: absolute;
  bottom: -18px;
  left: 50%;
  width: 24px;
  height: 20px;
  background-color: inherit;
  content: "";
  transform: translateX(-50%);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.contents-area.program-area .program-label span {
  margin-bottom: 8px;
  font-size: var(--fs18);
  line-height: 1.4;
}
.contents-area.program-area .program-frame {
  padding: 37px 0 38px;
  border-radius: 40px;
  background-color: #5ec750;
  width: 90%;
  max-width: 1280px;
  margin: 0 auto 40px;
}
.contents-area.program-area .program-body {
  display: grid;
  width: 90%;
  margin: 0 auto;
  padding: 43px 43px 43px 89px;
  border-radius: 30px;
  background-color: #fff;

  grid-template-areas:
    ".    img"
    "head img"
    "txt  img"
    "btn  img";
  grid-template-columns: 1fr min(444px, 40%);
  /* 1行目は空き。吹き出し（しっぽ含む）とカテゴリ名が重ならないよう最低40px確保 */
  grid-template-rows: minmax(40px, 1fr) auto auto auto;
  column-gap: 40px;
}
.contents-area.program-area .program-head {
  display: flex;
  align-items: center;

  grid-area: head;
  gap: 12px 24px;
}
.contents-area.program-area .program-head-ttl {
  flex-shrink: 0;
}
.contents-area.program-area .program-cat {
  font-size: var(--fs22);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: #4bb23d;
}
.contents-area.program-area .program-ttl {
  font-size: var(--fs36);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.06em;
}
.contents-area.program-area .program-tag {
  display: flex;
  flex-wrap: wrap;
  max-width: 320px;

  gap: 8px;
}
.contents-area.program-area .program-tag li {
  padding: 0 13px;
  border-radius: 14px;
  background-color: #f3f2f0;
  font-size: var(--fs15);
  font-weight: 700;
  line-height: 28px;
  letter-spacing: 0.06em;
  color: #4bb23d;
}
.contents-area.program-area .program-txt {
  margin-top: 18px;
  font-size: var(--fs16);
  line-height: 1.6;

  grid-area: txt;
}
.contents-area.program-area .program-btn {
  margin-top: 24px;

  grid-area: btn;
}
.contents-area.program-area .program-btn a {
  position: relative;
  display: flex;
  align-items: center;
  width: 296px;
  max-width: 100%;
  height: 58px;
  padding: 0 64px 0 34px;
  border: 2px solid #4bb23d;
  border-radius: 29px;
  background-color: #fff;
  font-size: var(--fs17);
  font-weight: 700;
  letter-spacing: 0.02em;
}
.contents-area.program-area .program-btn a::before {
  display: inline-block;
  width: 26px;
  background-image: url(../img/common/cmm_maru_arrow_bggreen.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  content: "";
  aspect-ratio: 1 / 1;
  position: absolute;
  right: 20px;
}
/* .contents-area.program-area .program-btn a::before {
  position: absolute;
  top: 50%;
  right: 19px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #4bb23d;
  content: "";
  transform: translateY(-50%);
}
.contents-area.program-area .program-btn a::after {
  position: absolute;
  top: 50%;
  right: 33px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
  transform: translateY(-50%) rotate(45deg);
} */
.contents-area.program-area .program-btn a:focus-visible {
  outline: 2px solid #262626;
  outline-offset: 3px;
}
.contents-area.program-area .program-img {
  overflow: hidden;
  align-self: center;
  border-radius: 30px;

  grid-area: img;
  aspect-ratio: 444 / 300;
}
.contents-area.program-area .program-img img {
  height: 100%;

  object-fit: cover;
}

/* 色分け */
.contents-area.program-area .program-box.sports .program-label {
  background-color: #f25f95;
}
.contents-area.program-area .program-box.sports .program-frame {
  background-color: #fc89b3;
}
.contents-area.program-area .program-box.sports .program-cat,
.contents-area.program-area .program-box.sports .program-tag li {
  color: #f25f95;
}
.contents-area.program-area .program-box.sports .program-btn a {
  border-color: #f25f95;
}
.contents-area.program-area .program-box.sports .program-btn a::before {
  background-image: url(../img/common/cmm_maru_arrow_bgpink.svg);
}

.contents-area.program-area .program-box.club .program-label {
  background-color: #3abde8;
}
.contents-area.program-area .program-box.club .program-frame {
  background-color: #3abde8;
}
.contents-area.program-area .program-box.club .program-cat,
.contents-area.program-area .program-box.club .program-tag li {
  color: #3abde8;
}
.contents-area.program-area .program-box.club .program-btn a {
  border-color: #3abde8;
}
.contents-area.program-area .program-box.club .program-btn a::before {
  background-image: url(../img/common/cmm_maru_arrow_bgblue.svg);
}

@media screen and (max-width: 1024px) {
  .contents-area.program-area .program-body {
    padding: 40px 30px 34px 40px;

    column-gap: 30px;
  }
  .contents-area.program-area .program-head {
    align-items: flex-start;
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.program-area {
    padding: 60px 0 46px;
  }
  .contents-area.program-area .program-logo {
    width: 136px;
  }
  .contents-area.program-area .sec-ttl {
    margin-top: 21px;
  }
  .contents-area.program-area .program-lead {
    margin-top: 25px;
    padding: 0 4.559271%; /* .max-inner の内側 → 左右38 */
    font-size: var(--fs15);
    line-height: 1.7;
    letter-spacing: 0.1em;
    text-align: left;
  }
  .contents-area.program-area .program-list {
    margin-top: 27px;
  }
  .contents-area.program-area .program-box {
    padding-top: 42px;
  }
  .contents-area.program-area .program-box + .program-box {
    margin-top: -17px;
  }
  .contents-area.program-area .program-label {
    left: 50%;
    width: 157px;
    height: 100px;
    font-size: var(--fs28);
    letter-spacing: 0;
    filter: drop-shadow(4px 4px 0 #fff);
    transform: translateX(-50%);
  }
  .contents-area.program-area .program-label::after {
    bottom: -13px;
    width: 20px;
    height: 14px;
  }
  .contents-area.program-area .program-label span {
    margin-bottom: 4px;
    font-size: var(--fs15);
    letter-spacing: 0;
  }
  .contents-area.program-area .program-frame {
    padding: 30px 0;
    border-radius: 30px;
    width: 100%;
  }
  .contents-area.program-area .program-body {
    width: calc(100% - 46px);
    padding: 27px 19px 30px;
    border-radius: 20px;

    grid-template-areas:
      "img"
      "head"
      "txt"
      "btn";
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .contents-area.program-area .program-img {
    border-radius: 20px;

    aspect-ratio: 291 / 180;
  }
  .contents-area.program-area .program-head {
    align-items: flex-start;
    flex-direction: column;
    margin-top: 14px;
    padding: 0 11px;

    gap: 13px;
  }
  .contents-area.program-area .program-cat {
    font-size: var(--fs15);
    letter-spacing: 0.05em;
  }
  .contents-area.program-area .program-ttl {
    font-size: var(--fs28);
    letter-spacing: 0;
  }
  .contents-area.program-area .program-tag {
    max-width: none;

    gap: 5px 6px;
  }
  .contents-area.program-area .program-tag li {
    padding: 0 13px;
    font-size: var(--fs12);
    line-height: 24px;
    letter-spacing: 0.1em;
  }
  .contents-area.program-area .program-txt {
    margin-top: 15px;
    padding: 0 11px;
    font-size: var(--fs14);
    line-height: 1.65;
    letter-spacing: 0.1em;
  }
  .contents-area.program-area .program-btn {
    margin-top: 19px;
    padding: 0 4px;
  }
  .contents-area.program-area .program-btn a {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    padding: 0 54px 0 24px;
    letter-spacing: 0.04em;
    font-size: var(--fs15);
  }
  .contents-area.program-area .program-btn a::before {
    right: 18px;
    width: 28px;
    height: 28px;
  }
  .contents-area.program-area .program-btn a::after {
    right: 31px;
  }
}

/* ====================================================
選べる！楽しいイベント .event-area
・PC：写真は 1366px 基準で四方に散らす（.event-wrap 基準の absolute）
・TAB：写真は黄色ボックスの下にまとめる（カンプなし・仮）
・SP：SPカンプどおり上2枚・下3枚
==================================================== */
.contents-area.event-area {
  overflow-x: clip;
  padding-bottom: 166px;
}
.contents-area.event-area .event-wrap {
  position: relative;
  max-width: 1366px;
  margin: 0 auto;
  /* 下余白 = カヤック写真の下端（41%幅 × 293/560） - 黄色ボックスとの重なり */
  padding: 53px 0 calc(min(21.452313vw, 293px) - 90px);
}
.contents-area.event-area .event-box {
  width: min(1200px, calc(100% - 80px));
  margin: 0 auto;
  padding: 0 20px 176px;
  border-radius: 40px;
  background-color: #fffcd6;
  text-align: center;
}
.contents-area.event-area .balloon-ttl {
  top: -53px;
  margin-bottom: -53px;
}
.contents-area.event-area .event-ttl {
  margin-top: 66px;
  font-size: var(--fs40);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
}
.contents-area.event-area .event-ttl span {
  font-size: 1.45em;
  line-height: 1;
}
.contents-area.event-area .event-ttl .green {
  color: #4bb23d;
}
.contents-area.event-area .event-ttl .orange {
  color: #f57d03;
}
.contents-area.event-area .event-txt {
  margin-top: 36px;
  font-size: var(--fs16);
  line-height: 1.67;
  letter-spacing: 0.05em;
}
.contents-area.event-area .event-btn {
  display: flex;
  justify-content: center;
  margin-top: 56px;

  gap: 42px;
}
.contents-area.event-area .event-btn .arrow-btn {
  width: 311px;
  height: 69px;
  border-radius: 35px;
}

.contents-area.event-area .event-img {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.contents-area.event-area .event-img figure {
  position: absolute;
  overflow: hidden;
  border-radius: min(2.928258vw, 40px);
}
.contents-area.event-area .event-img figure img {
  height: 100%;

  object-fit: cover;
}
/* スキー */
.contents-area.event-area .event-img-01 {
  top: 191px;
  left: 0;
  width: 20.57101%; /* 281 */
  border-radius: 0 40px 40px 0 !important;

  aspect-ratio: 281 / 296;
}
/* 飛行機 */
.contents-area.event-area .event-img-02 {
  top: 536px;
  left: 3.367496%; /* 46 */
  width: 19.253294%; /* 263 */

  aspect-ratio: 263 / 183;
}
/* カヤック */
.contents-area.event-area .event-img-03 {
  top: 559px;
  left: 29.502196%; /* 403 */
  width: 40.995608%; /* 560 */

  aspect-ratio: 560 / 293;
}
/* シャボン玉 */
.contents-area.event-area .event-img-04 {
  top: 92px;
  right: 0;
  width: 23.426061%; /* 320 */
  border-radius: 40px 0 0 40px !important;

  aspect-ratio: 320 / 300;
}
/* 宇宙服 */
.contents-area.event-area .event-img-05 {
  top: 471px;
  left: 80.527086%; /* 1100 */
  width: 16.544656%; /* 226 */

  aspect-ratio: 226 / 158;
}
.contents-area.event-area .event-img .scr {
  transform: scale(0.85);
}
.contents-area.event-area .event-img .scr.scr-on {
  transform: none;
}

@media screen and (max-width: 1024px) {
  .contents-area.event-area {
    padding-bottom: 100px;
  }
  .contents-area.event-area .event-wrap {
    padding-bottom: 0;
  }
  .contents-area.event-area .event-box {
    padding-bottom: 90px;
  }
  .contents-area.event-area .event-btn {
    gap: 20px;
  }
  .contents-area.event-area .event-img {
    position: relative;
    inset: auto;
    max-width: 760px;
    margin: -50px auto 0;

    aspect-ratio: 100 / 72;
  }
  .contents-area.event-area .event-img figure {
    border-radius: 20px;
  }
  .contents-area.event-area .event-img-01 {
    top: 0;
    left: 0;
    width: 28%;
    border-radius: 0 20px 20px 0 !important;
  }
  .contents-area.event-area .event-img-02 {
    top: 64%;
    left: 4%;
    width: 32%;
  }
  .contents-area.event-area .event-img-03 {
    top: 16%;
    left: 18%;
    width: 64%;
  }
  .contents-area.event-area .event-img-04 {
    top: 4%;
    right: 0;
    width: 28%;
    border-radius: 20px 0 0 20px !important;
  }
  .contents-area.event-area .event-img-05 {
    top: 68%;
    right: 5%;
    left: auto;
    width: 28%;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.event-area {
    padding-bottom: 60px;
  }
  .contents-area.event-area .event-wrap {
    padding: 32vw 0 17.866667vw; /* 上：黄色ボックス開始120 / 下：飛行機のはみ出し67 */
  }
  .contents-area.event-area .event-box {
    width: 100%;
    padding: 0 0 54.133333vw; /* 下の写真3枚ぶん 203 */
    border-radius: 0;
  }
  .contents-area.event-area .balloon-ttl {
    top: 0;
    width: 78.133333%; /* 293 */
    margin: 11.466667vw auto 0; /* 43 */
  }
  .contents-area.event-area .event-ttl {
    margin-top: 40px;
    font-size: var(--fs31);
    line-height: 1.58;
    letter-spacing: 0.06em;
  }
  .contents-area.event-area .event-ttl span {
    font-size: 1.32em;
  }
  .contents-area.event-area .event-txt {
    margin-top: 21px;
    padding: 0 8.8%; /* 33 */
    font-size: var(--fs14);
    line-height: 1.93;
    letter-spacing: 0.09em;
    text-align: left;
  }
  .contents-area.event-area .event-btn {
    flex-direction: column;
    margin-top: 43px;
    padding: 0 11.466667%; /* 43 */

    gap: 15px;
  }
  .contents-area.event-area .event-btn .arrow-btn {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    font-size: var(--fs18);
  }

  /* 写真：上2枚は .event-wrap 上端から、下3枚は下端から（375基準のvw） */
  .contents-area.event-area .event-img {
    position: absolute;
    inset: 0;
    max-width: none;
    margin: 0;

    aspect-ratio: auto;
  }
  .contents-area.event-area .event-img figure {
    border-radius: 20px;
  }
  /* 上2枚は画面の左右にはみ出す（.event-area の overflow-x: clip で切る） */
  .contents-area.event-area .event-img-01 {
    top: 14.666667vw; /* 55 */
    left: -4.8%; /* -18 */
    width: 47.466667%; /* 178 */
    border-radius: 20px !important;

    aspect-ratio: 178 / 161;
  }
  .contents-area.event-area .event-img-04 {
    top: 0;
    right: -7.733333%; /* -29 */
    width: 55.466667%; /* 208 */
    border-radius: 20px !important;

    aspect-ratio: 208 / 170;
  }
  .contents-area.event-area .event-img-03 {
    top: auto;
    bottom: 17.333333vw; /* 65 */
    left: 2.4%; /* 9 */
    width: 49.066667%; /* 184 */

    aspect-ratio: 184 / 140;
  }
  .contents-area.event-area .event-img-05 {
    top: auto;
    right: auto;
    bottom: 36vw; /* 135 */
    left: 60.8%; /* 228 */
    width: 35.2%; /* 132 */

    aspect-ratio: 132 / 97;
  }
  .contents-area.event-area .event-img-02 {
    top: auto;
    bottom: 0;
    left: 56.533333%; /* 212 */
    width: 35.466667%; /* 133 */

    aspect-ratio: 133 / 103;
  }
}

/* ====================================================
無料説明会 .seminar-area
==================================================== */
.contents-area.seminar-area {
  overflow: hidden;
  padding: 80px 0 100px;
  background-color: #5ec750;
}
.contents-area.seminar-area .seminar-wrap {
  display: flex;
  align-items: flex-start;
}
.contents-area.seminar-area .seminar-head {
  flex-shrink: 0;
  width: 340px;
  margin-left: max(40px, calc(50% - 543px));
  color: #fff;
}
.contents-area.seminar-area .seminar-cat {
  width: fit-content;
  padding: 0 22px;
  border-radius: 23px;
  background-color: #fff;
  font-size: var(--fs22);
  font-weight: 700;
  line-height: 46px;
  letter-spacing: 0.06em;
  color: #262626;
}
.contents-area.seminar-area .seminar-ttl {
  margin-top: 18px;
  font-size: clamp(4rem, 4.099561vw, 5.6rem); /* 56 */
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.04em;
}
.contents-area.seminar-area .seminar-lead {
  margin-top: 56px;
  font-size: var(--fs17);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.08em;
}
.contents-area.seminar-area .seminar-note {
  margin-top: 46px;
  padding: 0 4px;
  font-size: var(--fs15);
  line-height: 1.7;
}
.contents-area.seminar-area .seminar-btn {
  margin-top: 64px;
}
.contents-area.seminar-area .seminar-body {
  flex: 1;
  min-width: 0;
  margin-left: 52px;
  padding: 62px min(91px, 6.661786vw) 48px 71px;
  border-radius: 70px 0 0 70px;
  background-color: #fff;
}
.contents-area.seminar-area .seminar-group + .seminar-group {
  margin-top: 38px;
}
.contents-area.seminar-area .seminar-group-ttl {
  margin-left: 10px;
  font-size: var(--fs24);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  color: #f25f95;
}
.contents-area.seminar-area .seminar-scroll {
  overflow-x: auto;
  margin-top: 20px;
  padding-bottom: 13px;
}
/* Firefox など ::-webkit-scrollbar 非対応ブラウザ用 */
@supports not selector(::-webkit-scrollbar) {
  .contents-area.seminar-area .seminar-scroll {
    scrollbar-color: #aaa transparent;
    scrollbar-width: thin;
  }
}
.contents-area.seminar-area .seminar-scroll::-webkit-scrollbar {
  height: 12px;
}
.contents-area.seminar-area .seminar-scroll::-webkit-scrollbar-track {
  margin: 0 10px;
  background: transparent;
}
.contents-area.seminar-area .seminar-scroll::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background-color: #aaa;
}
.contents-area.seminar-area .seminar-list {
  display: flex;
  width: max-content;

  gap: 14px;
}
.contents-area.seminar-area .seminar-box {
  width: 136px;
  padding: 22px 12px 15px 20px;
  border-radius: 20px;
  background-color: #f7f7f7;
}
.contents-area.seminar-area .seminar-box-cat {
  display: flex;
  align-items: center;
  font-size: var(--fs13);
  font-weight: 700;
  line-height: 21px;
  color: #f25f95;

  gap: 6px;
}
.contents-area.seminar-area .seminar-box-cat::before,
.contents-area.seminar-area .seminar-box-time::before,
.contents-area.seminar-area .seminar-box-place::before {
  display: inline-block;
  flex-shrink: 0;
  background: url(../img/common/icon_calendar_pink.svg) no-repeat center / contain;
  content: "";
}
.contents-area.seminar-area .seminar-box-cat::before {
  width: 21px;
  height: 21px;
}
.contents-area.seminar-area .seminar-box-date {
  margin-top: 12px;
  font-size: var(--fs22);
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.contents-area.seminar-area .seminar-box-date span {
  font-size: var(--fs14);
  letter-spacing: -0.05em;
}
.contents-area.seminar-area .seminar-box-time,
.contents-area.seminar-area .seminar-box-place {
  display: flex;
  align-items: center;
  font-size: var(--fs15);
  line-height: 1.55;
  letter-spacing: 0.04em;
  white-space: nowrap;

  gap: 7px;
}
.contents-area.seminar-area .seminar-box-time {
  margin-top: 5px;
}
.contents-area.seminar-area .seminar-box-time::before,
.contents-area.seminar-area .seminar-box-place::before {
  width: 13px;
  height: 13px;
}
.contents-area.seminar-area .seminar-box-time::before {
  background-image: url(../img/common/icon_clock.svg);
}
.contents-area.seminar-area .seminar-box-place::before {
  background-image: url(../img/common/icon_pin.svg);
}
.contents-area.seminar-area .seminar-box-btn {
  margin: 16px 0 0 -8px;
}
.contents-area.seminar-area .seminar-box-btn a {
  position: relative;
  display: flex;
  align-items: center;
  width: 89px;
  height: 37px;
  margin: 0 auto;
  padding: 0 30px 0 21px;
  border-radius: 19px;
  background-color: #f25f95;
  font-size: var(--fs15);
  font-weight: 700;
  color: #fff;
}
.contents-area.seminar-area .seminar-box-btn a::before {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #fff;
  content: "";
  transform: translateY(-50%);
}
.contents-area.seminar-area .seminar-box-btn a::after {
  position: absolute;
  top: 50%;
  right: 20px;
  width: 4px;
  height: 4px;
  border-top: 1.5px solid #f25f95;
  border-right: 1.5px solid #f25f95;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}
.contents-area.seminar-area .seminar-group.weekday .seminar-group-ttl,
.contents-area.seminar-area .seminar-group.weekday .seminar-box-cat {
  color: #3abde8;
}
.contents-area.seminar-area .seminar-group.weekday .seminar-box-cat::before {
  background-image: url(../img/common/icon_calendar_blue.svg);
}
.contents-area.seminar-area .seminar-group.weekday .seminar-box-btn a {
  background-color: #3abde8;
}
.contents-area.seminar-area .seminar-group.weekday .seminar-box-btn a::after {
  border-color: #3abde8;
}

@media screen and (max-width: 1024px) {
  .contents-area.seminar-area .seminar-head {
    width: 270px;
  }
  .contents-area.seminar-area .seminar-body {
    margin-left: 36px;
    padding-left: 40px;
    border-radius: 50px 0 0 50px;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.seminar-area {
    padding: 48px 0 54px;
  }
  .contents-area.seminar-area .seminar-wrap {
    display: block;
  }
  .contents-area.seminar-area .seminar-head {
    width: auto;
    margin: 0;
    padding: 0 11.466667%; /* 43 */
  }
  .contents-area.seminar-area .seminar-cat {
    padding: 0 17px;
    border-radius: 18px;
    font-size: var(--fs17);
    line-height: 36px;
    letter-spacing: 0.07em;
  }
  .contents-area.seminar-area .seminar-ttl {
    margin-top: 12px;
    font-size: var(--fs39);
  }
  .contents-area.seminar-area .seminar-lead {
    margin-top: 25px;
    padding: 0 0 0 5px;
    font-size: var(--fs15);
    line-height: 1.75;
    letter-spacing: 0.03em;
  }
  .contents-area.seminar-area .seminar-note {
    margin-top: 21px;
    padding: 0 0 0 5px;
    font-size: var(--fs14);
    line-height: 1.83;
  }
  .contents-area.seminar-area .seminar-btn {
    margin: 33px -5px 0;
  }
  .contents-area.seminar-area .seminar-btn .arrow-btn {
    width: 100%;
    height: 66px;
    border-radius: 33px;
  }
  .contents-area.seminar-area .seminar-btn .arrow-btn::before {
    right: 22px;
    width: 32px;
    height: 32px;
  }
  .contents-area.seminar-area .seminar-btn .arrow-btn::after {
    right: 36px;
    width: 7px;
    height: 7px;
  }
  .contents-area.seminar-area .seminar-body {
    margin: 44px 0 0 6.133333%; /* 23 */
    padding: 42px 0 44px 30px;
    border-radius: 40px 0 0 40px;
  }
  .contents-area.seminar-area .seminar-group + .seminar-group {
    margin-top: 22px;
  }
  .contents-area.seminar-area .seminar-group-ttl {
    margin-left: 0;
    font-size: var(--fs20);
  }
  .contents-area.seminar-area .seminar-scroll {
    margin-top: 14px;
    padding: 0 20px 18px 0;
  }
  .contents-area.seminar-area .seminar-list {
    gap: 15px;
  }
  .contents-area.seminar-area .seminar-box {
    width: 125px;
    padding: 18px 8px 17px 16px;
  }
  .contents-area.seminar-area .seminar-box-cat {
    font-size: var(--fs11);
    line-height: 17px;

    gap: 5px;
  }
  .contents-area.seminar-area .seminar-box-cat::before {
    width: 17px;
    height: 17px;
  }
  .contents-area.seminar-area .seminar-box-date {
    margin-top: 10px;
    font-size: var(--fs17);
  }
  .contents-area.seminar-area .seminar-box-date span {
    font-size: var(--fs11);
  }
  .contents-area.seminar-area .seminar-box-time,
  .contents-area.seminar-area .seminar-box-place {
    font-size: var(--fs14);

    gap: 5px;
  }
  .contents-area.seminar-area .seminar-box-time {
    margin-top: 4px;
  }
  .contents-area.seminar-area .seminar-box-time::before,
  .contents-area.seminar-area .seminar-box-place::before {
    width: 12px;
    height: 12px;
  }
  .contents-area.seminar-area .seminar-box-btn {
    margin: 8px 0 0 -8px;
  }
  .contents-area.seminar-area .seminar-box-btn a {
    width: 88px;
    height: 31px;
    padding: 0 30px 0 22px;
    border-radius: 16px;
    font-size: var(--fs13);
  }
  .contents-area.seminar-area .seminar-box-btn a::before {
    right: 14px;
    width: 13px;
    height: 13px;
  }
  .contents-area.seminar-area .seminar-box-btn a::after {
    right: 19px;
  }
}

/* ====================================================
ニュース・レポート .news-area
==================================================== */
.contents-area.news-area {
  display: flex;
  align-items: flex-start;
  padding: 95px 0 126px;
}
.contents-area.news-area .news-img {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  width: min(27.891654vw, 381px);
  margin-left: max(40px, calc(50% - 600px));
}
.contents-area.news-area .news-img figure {
  overflow: hidden;
  border-radius: min(2.928258vw, 40px);

  aspect-ratio: 381 / 288;
}
.contents-area.news-area .news-img figure + figure {
  margin-top: 33px;
}
.contents-area.news-area .news-img img {
  height: 100%;

  object-fit: cover;
}
.contents-area.news-area .news-body {
  flex: 1;
  min-width: 0;
  margin: 36px 0 0 -55px;
  padding: 80px max(40px, calc(50vw - 537px)) 98px 137px;
  border-radius: 0 0 0 70px;
  background-color: #f3f2f0;
}
.contents-area.news-area .news-head {
  position: relative;
}
.contents-area.news-area .news-sub {
  font-size: var(--fs20);
  font-weight: 700;
  line-height: 1.5;
  color: #4bb23d;
  letter-spacing: 0.03em;
}
.contents-area.news-area .news-ttl {
  margin-top: 6px;
  font-size: var(--fs34);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.03em;
}
.contents-area.news-area .news-more {
  position: absolute;
  right: 0;
  bottom: 0;
}
.contents-area.news-area .news-more a {
  position: relative;
  display: flex;
  align-items: center;
  width: 107px;
  height: 50px;
  padding-left: 22px;
  border-radius: 25px;
  background-color: #fff;
  font-size: var(--fs15);
  font-weight: 700;
}
.contents-area.news-area .news-more a::before {
  position: absolute;
  top: 50%;
  right: 17px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #4bb23d;
  content: "";
  transform: translateY(-50%);
}
.contents-area.news-area .news-more a::after {
  position: absolute;
  top: 50%;
  right: 27px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
  transform: translateY(-50%) rotate(45deg);
}
.contents-area.news-area .news-list {
  margin-top: 45px;
}
.contents-area.news-area .news-list li {
  padding: 16px 0 13px;
  border-bottom: 2px dashed #5ec750;
}
.contents-area.news-area .news-list li:first-child {
  padding-top: 0;
}
.contents-area.news-area .news-list a {
  display: flex;
  align-items: center;
  padding-left: 12px;

  gap: 27px;
}
.contents-area.news-area .news-list-img {
  overflow: hidden;
  flex-shrink: 0;
  width: 132px;
  border: 5px solid #fff;
  border-radius: 28px;
  background-color: #fff;

  aspect-ratio: 132 / 100;
}
.contents-area.news-area .news-list-img img {
  height: 100%;
  border-radius: 23px;

  object-fit: cover;
}
.contents-area.news-area .news-list-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  gap: 4px 9px;
}
.contents-area.news-area .news-list-cat {
  padding: 0 13px;
  border-radius: 14px;
  background-color: #f25f95;
  font-size: var(--fs14);
  font-weight: 700;
  line-height: 28px;
  letter-spacing: 0.06em;
  color: #fff;
}
.contents-area.news-area .news-list-meta time {
  font-size: var(--fs14);
  color: #707070;
}
.contents-area.news-area .news-list-ttl {
  margin-top: 8px;
  font-size: var(--fs17);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.06em;
}

@media screen and (max-width: 1024px) {
  .contents-area.news-area .news-body {
    padding-left: 95px;
  }
  .contents-area.news-area .news-list a {
    gap: 18px;
  }
  .contents-area.news-area .news-list-img {
    width: 110px;
  }
}
@media screen and (max-width: 767px) {
  .contents-area.news-area {
    display: block;
    padding: 26px 0 86px;
  }
  .contents-area.news-area .news-img {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: auto;
    margin: 0;
  }
  .contents-area.news-area .news-img figure:first-child {
    width: 50.666667%; /* 190 */
    border-radius: 0 20px 20px 0;

    aspect-ratio: 190 / 169;
  }
  .contents-area.news-area .news-img figure + figure {
    width: 42.666667%; /* 160 */
    margin-top: 47px;
    border-radius: 20px 0 0 20px;

    aspect-ratio: 160 / 169;
  }
  .contents-area.news-area .news-body {
    margin: -96px 0 0 6.4%; /* 24 */
    padding: 108px 14px 62px 30px;
    border-radius: 30px 0 0 30px;
  }
  .contents-area.news-area .news-sub {
    font-size: var(--fs15);
    line-height: 1.47;
    letter-spacing: 0.1em;
  }
  .contents-area.news-area .news-ttl {
    margin-top: 8px;
    font-size: var(--fs28);
    letter-spacing: 0;
  }
  .contents-area.news-area .news-more {
    position: static;
    margin-top: 10px;
  }
  .contents-area.news-area .news-more a {
    width: 85px;
    height: 31px;
    margin-left: auto;
    padding-left: 17px;
    border-radius: 16px;
    font-size: var(--fs14);
    letter-spacing: 0.15em;
  }
  .contents-area.news-area .news-more a::before {
    right: 10px;
    width: 18px;
    height: 18px;
  }
  .contents-area.news-area .news-more a::after {
    right: 18px;
    width: 5px;
    height: 5px;
  }
  .contents-area.news-area .news-list {
    margin: 20px 15px 0 -7px;
  }
  .contents-area.news-area .news-list li {
    padding: 18px 0 16px;
  }
  .contents-area.news-area .news-list a {
    padding-left: 0;

    gap: 26px;
  }
  .contents-area.news-area .news-list-img {
    width: 98px;
    border-width: 3px;
    border-radius: 18px;

    aspect-ratio: 98 / 75;
  }
  .contents-area.news-area .news-list-img img {
    border-radius: 15px;
  }
  .contents-area.news-area .news-list-meta {
    gap: 4px 14px;
  }
  .contents-area.news-area .news-list-cat {
    padding: 0 11px;
    font-size: var(--fs12);
    line-height: 24px;
  }
  .contents-area.news-area .news-list-meta time {
    font-size: var(--fs12);
    letter-spacing: 0.06em;
  }
  .contents-area.news-area .news-list-ttl {
    margin-top: 6px;
    font-size: var(--fs15);
    line-height: 1.53;
    letter-spacing: 0.02em;
  }
}

/* ====================================================
WordPress化で追加
==================================================== */
/* ニュース・レポート：カテゴリー名の色分け（news-report.css と同じルール）
   「もっと知りたいリックキッズ」（category1）とその子カテゴリーは青
   ※ クラスは functions.php の lickids_get_news_report_cat_class() で付与（cat-スラッグ cat-親スラッグ） */
.contents-area.news-area .news-list-cat.cat-category1 {
  background-color: #3abde8;
}

/* 説明会日程・ニュースがないときの文言 */
.contents-area.seminar-area .seminar-empty {
  margin-top: 20px;
  font-size: var(--fs15);
  line-height: 1.7;
}
.contents-area.news-area .news-empty {
  margin-top: 45px;
  font-size: var(--fs15);
  line-height: 1.7;
}
@media screen and (max-width: 767px) {
  .contents-area.seminar-area .seminar-empty {
    margin-top: 14px;
    padding-right: 20px;
    font-size: var(--fs14);
  }
  .contents-area.news-area .news-empty {
    margin-top: 20px;
    font-size: var(--fs14);
  }
}