
:root{
  --bg: #e6e7ea;               /* グレー背景 */
  --blue-900:#0b3fae;
  --blue-800:#1656d0;
  --blue-700:#2b6fe6;
  --blue-600:#3e8af6;
  --panel:#f6fbff;
  --card:#ffffff;
  --pink:#ff3b93;
  --accent:#ff4d4d;
  --shadow: 0 1rem 3rem rgba(0,0,0,.12);
  --radius: 1.8rem;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:"Noto Sans JP",system-ui,-apple-system,Segoe UI,Roboto,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;color:#1b1e28;line-height:1.65}
a{color:inherit}


.wrap{
  max-width:96rem;
  margin:0 auto;
  padding:2.4rem 1.6rem 8rem;
}

img {
  width: 100%;
}
.footer img { /* footerの画像はwidth:100%を除外 */
  width: auto;
}

.main {
  background-color: #E7F2FE;
}

/*  .header { //headerの指定は共通CSSを参照する
  background-color: #fff;
  padding: 1.2rem 1.6rem;
}

.header__container {
display: flex;
align-items: center;
justify-content: space-between;
}

.header__logo img {
width: 8.6rem;
margin-bottom: 0.8rem;
}

.header__logo-group img {
width: 15rem;
}

.header__nav {
display: flex;
align-items: baseline;
}

.header__nav a {
width: 4rem;
display: block;
;
text-align: center;
}

.header__nav a:first-child {
margin-right: 1rem;
}

.header__nav .header__nav-button--primary img {
width: 1.8rem;
height: auto;
}

.header__nav .header__nav-button--primary p {
color: #008ED8;
margin: 0;
font-size: 1rem;
margin-top: 0.8rem;
font-weight: bold;
}

.header__logo-zemi-text {
font-size: 1.4rem;
font-weight: bold;
margin-left: 1.5rem;
}

.header__nav-menu-icon img {
width: 1.8rem;
}

.header__nav-text {
font-size: 1rem;
margin: 0;
margin-top: 0.8rem;
color: #008ED8;
font-weight: bold;
}

.header__nav-button--secondary .header__nav-text {
margin-top: 0.7rem;
}*/

/* 青い縦リボンの大きいパネル */
.hero{
  position:relative;
  overflow:hidden;
}

.hero__container {
  background-color: #008ED8;
  border-radius: 4.8rem;
  padding-bottom: 13rem;
}
.hero__title {
  font-size: 2rem;
  color: #fff;
  text-align: center;
  padding-top: 1.6rem;
}
.hero-inner{
  display:grid;
  grid-template-columns: 1fr;
  gap:2.4rem;
  padding: 2rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.0) 14rem, rgba(255,255,255,.08) 14rem);
  border-radius: 2.8rem;
}

.c-hero__bg .hero__image {
  width: 51rem;
  max-width: 100%;
}

.hero__image img {
  height: auto;
}

/* 入会案内コンテナ */
.enrollment-container {
background-color: #3399FF;
border-radius: 4rem;
color: #fff;
width: 90%;
  margin: 0 auto;
  padding: 2.3rem 1.5rem;
  margin-top: -13rem;
  padding-bottom: 2.3rem;
}

.enrollment-deadline-info {
  display: flex;
  justify-content: center;
  align-items: center;
}

.enrollment-deadline-label {
  font-size: 1.4rem;
  text-align: center;
  margin-right: 1rem;
  line-height: 1.4;
}

.enrollment-deadline-date {
  font-size: 4rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  font-family: Inter;
}

.enrollment-deadline-date span {
  width: 2.8rem;
  height: 2.7rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #F62A7E;
  font-size: 1.4rem;
  background-color: #fff;
  border-radius: 50%;
  margin-left: 1rem;
}

.enrollment-deadline-note {
  font-size: 1rem;
  text-align: center;
  margin-top: 0;
  margin-bottom: 10px;
}


.enrollment-main-title {
  font-size: 1.6rem;
  text-align: center;
  margin-bottom: 0;
  line-height: 1.3;
}

.enrollment-main-headline > div {
  display: flex;
  align-items: center;
  justify-content: center;
}

.enrollment-main-headline div p {
  margin: 0;
  font-weight: bold;
}

.enrollment-main-headline div p span {
  display: block;
}

.enrollment-main-headline .enrollment-main-headline-span {
  font-size: 6.5rem;
}

.enrollment-main-headline .enrollment-main-headline-span2 {
  font-size: 2.9rem;
}

.enrollment-main-headline .enrollment-main-headline-span3 {
  font-size: 2rem;
}

.enrollment-main-headline .enrollment-main-headline_txt {
  font-size: 2.8rem;
  margin-top: 0;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.2rem;
}

.enrollment-main-headline .enrollment-main-headline-text {
  justify-content: center;
  gap: 1rem;
}

.enrollment-zero-cost-buttons .enrollment-zero-button .enrollment-zero-amount span{
  display: inline;
}

.enrollment-zero-button {
  width: 9.4rem;
  height: 9.4rem;
  background-color: #F62A7E;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;  
  margin: 0.6rem;
}

.enrollment-zero-amount span {
  font-size: 3.4rem;
}

.enrollment-zero-button .enrollment-zero-amount {
  line-height: 1.2;
  font-size: 2rem;
}

.enrollment-zero-label {
  font-size: 1.3rem;
}

.enrollment_imakyozai {
  margin-top: 1.5rem;
}

.enrollment-payment-text {
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
}

.enrollment-payment-section {
  margin-top: 2.4rem;
}


.enrollment-delivery-title {
color: var(--white, #FFF);
font-feature-settings: 'palt' on;

/* label_bold_L */
font-family: "Noto Sans JP";
font-size: 2.4rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 3.12rem */
margin-top: 2rem;
}


.enrollment-delivery-card {
  background-color: #fff;
  border-radius: 2.4rem;
  position: relative;
}

.enrollment-delivery-card-header {
  background-color: #F62A7E;
  width: max-content;
  border-radius: 1.5rem;
  padding: 0.3rem 1rem;
  position: absolute;
  top: 0.5rem;
  left: 0.7rem;
}

.enrollment-delivery-card-list li {
  color: var(--text, #333442);
  font-feature-settings: 'palt' on;

  /* label_S */
  font-family: "Noto Sans JP";
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%; /* 1.82rem */
  list-style: disc;
  
}

.enrollment-delivery-card-list li p {
  color: #676979;
  font-size: 1rem;
  line-height: 1.3;
}

.enrollment-delivery-cards {
  display: flex;
  gap: 1.6rem; /* カード間の余白 */
  overflow-x: auto;        /* 横スクロール */
  scroll-snap-type: x mandatory; /* スナップ */
  padding: 1.5rem 0;
  -webkit-overflow-scrolling: touch;
}

.enrollment-delivery-card {
  flex: 0 0 80%; /* カードの幅（80%にすればスマホで見切れる） */
  max-width: 19rem;
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.2rem;
  scroll-snap-align: start; /* スナップ位置 */
}



.enrollment-delivery-card-images img {
  max-width: 100%;
  border-radius: var(--radius);
}

.enrollment-delivery-card-list {
  padding-left: 1.8rem;
  margin: 1rem 0;
  font-size: 1.4rem;
  list-style: disc;
  margin-bottom: 0;
}

.enrollment-delivery-card-note {
  font-size: 1rem;
  color: #666;
  margin-top: auto;
  line-height: 1.3;
}

.enrollment-service-title {
  font-size: 1.1rem;
  text-align: center;
  margin-top: 1.5rem;
  font-weight: bold;
  margin-bottom: 10px;
  background-color: transparent;
  max-width: 100%;
  box-shadow: none;
  padding: 0;
}

#deliveryModal8 p {
  color: #000;
}

#deliveryModal8 .modal__close {
  color: #000;
}

.enrollment-price-info {
font-size: 1rem;
text-align: center;
font-weight: 400;
letter-spacing: -0.05em;
}

.enrollment-cta-text {
font-size: 2.4rem;
text-align: center;
font-weight: bold;
margin-bottom: 0;
}

.campaign {
width: 90%;
margin: 0rem auto;
}

.campaign .campaign-title {
margin: 2rem 0;
}

.campaign .campaign-title {
font-size: 2.4rem;
text-align: center;
font-weight: bold;
}

.campaign-banner {
display: flex;
gap: 1rem;
margin-bottom: 6rem;
}

.learning-choice {
background-color: #E7F2FE;
border-radius: 4.8rem 4.8rem 0 0;
padding: 2.6rem;
}

.learning-choice__title {
margin-top: 0;
}

.learning-choice__title {
text-align: center;
color: #00ADEA;
font-size: 2.5rem;
line-height: 1.3;

}

.learning-choice__subtitle2 {
color: #008ED8;
text-align: center;
font-size: 2.5rem;
font-weight: 900;
margin-top: 0;
margin-bottom: 0;
}

.learning-choice__instruction {
font-size: 1.6rem;
font-weight: 700;
text-align: center;
margin-top: 0;
margin-bottom: 3rem;
}

.learning-choice__message-text {
text-align: center;
font-size: 1.8rem;
font-weight: bold;
}

.learning-choice__message-text span {
color: #008ED8;
}


/* ========== circle-cluster (BEM) ========== */

/* ブロック */
.circle-cluster {
position: relative;
max-width: 36rem;           /* 必要に応じて上書き可 */
aspect-ratio: 1 / 1;    
margin: 0 auto;    /* 正方コンテナ（不要なら削除） */
}

/* 要素：共通バブル */
.circle-cluster__bubble {
width: 20rem;
height: 16rem;
aspect-ratio: 1 / 1;
border-radius: 50%;
display: grid;
place-items: center;
position: relative;
z-index: 1;
/* box-shadow: var(--shadow, 0 1.8rem 4rem rgba(10, 133, 219, .25)); */
/* background: #fff; */
/* outline: var(--ring, 0.6rem) solid var(--blue-600, #3e8af6); */
}

.circle-cluster__bubble-inner {
width: 100%;
height: 100%;
border-radius: inherit;
display: flex;
flex-direction: column;
place-items: center;
padding: 14% 12%;
text-align: center;
position: relative;
}

/* 見出し・本文 */
.circle-cluster__bubble-title {
color: var(--blue-900, #0b3fae);
font-weight: 900;
font-size: clamp(2.2rem, 5.5vw, 3.2rem);
margin-bottom: .15em;
}

.circle-cluster__bubble-desc {
color: #424b5a;
font-weight: 900;
font-size: clamp(1.4rem, 3vw, 1.8rem);
line-height: 1.45;
}

/* 修飾子：上のバブル（塗り＋リング） */
.circle-cluster__bubble--top {
/* background: #00ADEA;
outline: var(--ring, 0.6rem) solid var(--blue-600, #008ED8); */
margin: 0 auto;
}
.circle-cluster__bubble--top .circle-cluster__bubble-title {
color: #fff;

}
.circle-cluster__bubble--top .circle-cluster__bubble-desc {
color: #eaf6ff;
font-size: clamp(1.4rem, 3.1vw, 1.8rem);
margin-top: .25em;
margin-top: 0;
}

.circle-cluster_bk {
  position: absolute;
  width: 23.5rem;
  left: 50%;
  bottom: 42%;
  transform: translate(-50%, 50%);
  z-index: 0;
}

.circle-cluster_block {
  display: flex;
  justify-content: space-between;
}

/* 要素：下向き矢印の丸ボタン */
.circle-cluster__chev {
position: absolute;
left: 50%; bottom: 10%;
transform: translateX(-50%);
width: 2.7rem; height: 2.7rem;
border-radius: 50%;
display: grid; place-items: center;
background: #fff;
box-shadow: 0 0.6rem 1.8rem rgba(0,0,0,.12);
color: var(--blue-600, #3e8af6);
font-weight: 900; line-height: 1;
font-size: 2.2rem;
}
.circle-cluster__chev::before { content: "⌄"; }

/* 要素：中央キャラ（画像を置く場合は img を中に） */
.circle-cluster__mascot {
position: absolute;
left: 50%; 
bottom: 35%;
transform: translate(-50%, 50%);
width: min(34%, 16rem);
aspect-ratio: 1 / 1;
overflow: hidden;
z-index: 9;
}
.circle-cluster__mascot img {
width: 100%; height: 100%; object-fit: contain; display: block;

}


/* リボン上部（締切） */
.deadline{
  background:linear-gradient(180deg, #1a53d3, #0f45bf);
  color:#fff;
  border-radius: 2.2rem;
  padding:1.6rem 1.8rem;
  display:flex;align-items:center;gap:1.4rem;
  box-shadow: inset 0 0.1rem 0 rgba(255,255,255,.25);
}
.deadline .label{font-weight:700;letter-spacing:.02em}
.deadline .date{
  margin-left:auto;
  display:flex;align-items:baseline;gap:1rem;
}
.deadline .big{font-size:4.6rem;font-weight:900;line-height:1}
.deadline .day{
  display:inline-grid;place-items:center;
  width:3rem;height:3rem;border-radius:50%;
  background:#fff;color:#0f45bf;font-weight:700;font-size:1.4rem;
}
.caption{color:#e9f1ff;font-size:1.2rem;margin-top:0.4rem}

/* メイン見出し帯 */
.catch{
  background: #fff;
  border-radius: 2.2rem;
  padding: 1.8rem;
  color:#0e2a6b;
  font-weight:900;
  font-size: clamp(2.2rem, 4.8vw, 4rem);
  line-height:1.25;
}
.badges{display:flex;gap:1rem;margin-top:1rem;flex-wrap:wrap}
.badge{
  background:var(--pink);
  color:#fff;font-weight:800;
  border-radius:99.9rem;padding:1rem 1.6rem;
  box-shadow: 0 0.6rem 1.6rem rgba(255,59,147,.25);
  font-size:1.4rem;letter-spacing:.08em;
}

/* 3ステップ風 ラベル群 */
.steps{
  display:flex;gap:1.2rem;flex-wrap:wrap;margin:1.4rem 0 0;
}
.step{
  background:#e7f0ff;border-radius:1.2rem;padding:1rem 1.2rem;color:#0e2a6b;font-weight:700;font-size:1.3rem;
}

/* セクション：お届け教材 */
.section{
  background: var(--panel);
  border-radius: 2.2rem;
  padding: 1.8rem;
  box-shadow: inset 0 0.1rem 0 rgba(255,255,255,.5);
}
.section h2{
  margin:0 0 1rem;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  color:#073182;
}
.cards{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(22rem, 1fr);
  gap:1.6rem;
  overflow-x:auto;
  padding-bottom:0.6rem;
  scroll-snap-type:x mandatory;
}
.card{
  background:var(--card);
  border-radius:1.8rem;
  box-shadow: var(--shadow);
  padding:1.4rem;
  min-height:22rem;
  scroll-snap-align:start;
}
.chip{
  display:inline-block;
  background:#ffe6f3;color:#c2185b;font-weight:700;
  padding:0.6rem 1rem;border-radius:99.9rem;font-size:1.2rem;margin-bottom:1rem;
}
.thumb{
  display:grid;place-items:center;
  background:linear-gradient(180deg,#f2f6ff,#eef7ff);
  border:0.1rem solid #e7eefc;border-radius:1.2rem;
  height:12rem;margin-bottom:1rem;color:#6b7280;font-size:1.3rem;
}
.card h3{margin:0.4rem 0 0.4rem;font-size:1.6rem}
.card p{margin:0;color:#4b5563;font-size:1.3rem}

/* CTA */
.cta{
  display:grid;place-items:center;
  padding: 4.8rem 2.4rem;
  background-color: #00ADEA;
  border-radius: 5.6rem;
}

.feature1_inner2 .cta {
  background: var(--3, #34BBD8);
}
.feature1_inner3 .cta {
  background: var(--1, #39F);
}
/*.cta a{
  display:inline-flex;align-items:center;gap:1rem;
  background:#f44336;
  background: linear-gradient(180deg,#ff5a51,#e93a2f);
  color:#fff;text-decoration:none;
  padding:1.4rem 2.4rem;border-radius:99.9rem;font-weight:900;
  font-size:1.8rem;letter-spacing:.06em;
  box-shadow: 0 1rem 2.2rem rgba(233,58,47,.32);
} */
.cta__title {
  color: #fff;
  font-size: 2.6rem;
  margin-top: 0;
  line-height: 1.3;
  margin-bottom: 0;
}
.cta small{display:block;color:#12326c;margin-top:0.6rem;font-size:1.2rem;opacity:.8}
.cta__subtitle {
  color: #fff;
  font-size: 4.2rem;
  margin: 0;
}

.cta__content {
  margin-bottom: 2.5rem;
}

/* ===== feature-list (BEM) ===== */

.feature-list {
display: grid;
gap: 0.8rem;
}

/* pill カード本体 */
.feature-list__item {
display: grid;
grid-template-columns: auto 1fr auto; /* 左:番号 / 中:本文 / 右:矢印 */
align-items: center;
gap: 0rem;
padding: 1rem 0.1rem 1.5rem 0rem;
background: var(--card, #fff);
border-radius: 99.9rem; /* 楕円のpill形 */
box-shadow: 0 1rem 3rem rgba(0,0,0,.08);
border: 0.2rem solid rgba(0,0,0,0); /* 影を活かしつつ枠ナシ */
position: relative;
}

/* 左の大きい番号丸 */
.feature-list__num {
inline-size: 5.6rem;
border-radius: 50%;
display: grid; 
place-items: center;
color: var(--0-guide, #008ED8);
font-family: Inter;
font-size: 4.6rem;
font-style: normal;
font-weight: 900;
line-height: 2.9rem; /* 63.043% */
}

/* 中央テキスト */
.feature-list__body { min-width: 0; } /* タイトル折返し用 */
.feature-list__meta {
color: var(--1, #39F);
font-feature-settings: 'palt' on;

/* label_bold_S */
font-family: "Noto Sans JP";
font-size: 1.4rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 1.82rem */
margin: 0;
}
.feature-list__title {
margin: 0;
color: #1b1e28;
font-weight: 900;
font-size: clamp(1.8rem, 2.8vw, 2.4rem);
line-height: 1.25;
}

/* 右側の下向き矢印（丸） */
.feature-list__chev {
inline-size: 4rem;
block-size: 4rem;
border-radius: 50%;
margin-left: 0.8rem;
border: none;
background: #fff;
color: var(--blue-700, #2A90EA);
display: grid; place-items: center;
cursor: default; /* クリック不要なら default ／開閉実装するなら pointer */
position: relative;
}
.feature-list__chev::before {
content: "";
inline-size: 1rem; block-size: 1rem;
border-right: 0.3rem solid currentColor;
border-bottom: 0.3rem solid currentColor;
transform: rotate(45deg);
margin-top: -0.2rem; /* 少しだけ下向きを強調 */
}

/* 任意：hoverでわずかに持ち上げる */
.feature-list__item:hover {
box-shadow: 0 1.4rem 3.6rem rgba(0,0,0,.12);
transform: translateY(-0.1rem);
}


/* ========== Feature Section ========== */
.feature {
background: #eaf2fb;
padding: 2.4rem 1.6rem;
text-align: center;
}

/* ヘッダー */
.feature__header {
position: relative;
margin-bottom: 2.4rem;
text-align: left;
}
.features3_wrap {
  background-color: #008ED8;
}
.features3 .feature__header {
  margin-bottom: 1rem;
}
.feature__label {
font-weight: 700;
color: var(--blue-700, #2b6fe6);
font-size: 1.8rem;
}
.feature__number {
font-size: 2.8rem;
font-weight: 900;
margin-left: 0.4rem;
}
.feature__title {
font-weight: 900;
font-size: 2.4rem;
color: var(--blue-900, #0b3fae);
line-height: 1.3;
}
.feature__subtitle {
display: block;
font-weight: 900;
color: #222;
margin-top: 0.4rem;
font-size: 3.4rem;
}
.feature__badge {
position: absolute;
right: 0;
top: 21rem;
background: #e60012;
color: #fff;
font-size: 1.4rem;
font-weight: 900;
border-radius: 50%;
width: 11.3rem;
height: 11.3rem;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
line-height: 1.2;
}

/* 円背景部分 */
.feature__circle {
padding: 0 2rem 0rem;
margin: 0rem auto;
max-width: 34rem;
color: #fff;
position: relative;
}
.feature__circle-text {
font-size: 1.6rem;
font-weight: 700;
margin: 1.6rem 0;
line-height: 1.4;
border-radius: 50%;
width: 30rem; /*レイアウトが崩れるためrem指定に変えています。値は適当です */
height: 30rem; /*レイアウトが崩れるためrem指定に変えています。値は適当です */
display: flex;
justify-content: center;
align-items: center;
background-color: #34BBD8;
}


.feature1_inner3 .feature__circle-text {
  background-color: #00ADEA;
}
.feature1_inner3 .feature__circle-text2 {
  background-color: #34BBD8;
}

.feature__circle-text1 p {
margin-top: 0;
margin-bottom: 5rem;
}
.feature__circle-text2 {
background-color: #00ADEA;
margin-top: -4.5rem;
}
.feature__circle-text p {
line-height: 1.3;
}
.feature__highlight {
font-size: 4rem;
font-weight: 900;
}
.feature__image {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 28.8rem;
}
.feature__image img {
width: 100%;
height: auto;
display: block;
margin: 1.2rem auto;
}

/* CTAエリア */
.feature__cta {
padding: 2.5rem 0;
}
.enrollment-container .feature__cta {
padding: 0;
}
.feature__cta-lead {
font-weight: bold;
font-size: 2.2rem;
color: #008ED8;
margin-bottom: 0rem;
text-align: center;
}
.feature__cta-button { 
padding: 0 0 1.4rem 0;
display: block;
width: 100%;
padding-bottom: 0;
}


.feature__label  {
display: inline-flex;
align-items: center;
font-size: 2rem;
border-bottom: 1.2rem solid #3399FF;
color: #3399FF;
line-height: 1;
}

.feature__number {
font-size: 7rem;
color: #3399FF;
}

.feature__title {
font-size: 5rem;
color: #3399FF;
margin-top: 0;
}

.features {
padding: 6.4rem 2rem 2rem 2rem;
border-radius: 5.6rem;
background-color: #34BBD8;
position: relative;
width: 95%;
margin: 0 auto;
}

.features__title {
font-size: 5rem;
color: #fff;
font-weight: bold;
margin-top: 0;
line-height: 1.3;
}

.features .feature__subtitle {
color: #fff;
}

.features__hero_box {
background-color: #fff;
border-radius: 3.2rem;
padding: 2.4rem;
position: relative;
}

.features__hero_box1 {
  margin-bottom: 1rem;
}

.features__hero_box h3 {
font-size: 2.4rem;
font-weight: 900;
margin-top: 0;
line-height: 1.3;
color: #008ED8;
margin-bottom: 2.5rem;
letter-spacing: -0.2rem;
}

.features__hero_box1 h3 {
  color: var(--0-guide, #008ED8);
text-align: center;
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 26px */
margin-bottom: 1rem;
}

.features__hero_box p {
font-size: 1.6rem;
line-height: 1.5;
margin-bottom: 0;
letter-spacing: -0.01rem;
font-weight: 400;
margin-top: 1.2rem;
}

.features_hero_offer {
  color: var(--sub2, #676979);
font-feature-settings: 'palt' on;

/* text_ss */
font-family: "Noto Sans JP";
font-size: 1.2rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 18px */
}

.features__hero-character {
position: absolute;
top: 23rem;
z-index: 1;
left: 0;
}

.features__hero {
margin-top: 25.5rem;
position: relative;
z-index: 2;
}

.features__hero_box_img_everyday {
width: 8.9rem;
display: block;
position: absolute;
top: 3.7rem;
right: 1.5rem;
}

.features__hero_box .features__hero_box_txt_everyday {
color: var(--sub2, #676979);
font-feature-settings: 'palt' on;

/* text_ss */
font-family: "Noto Sans JP";
font-size: 1.2rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 1.8rem */
}

.arrow-bar {       /* 背景の水色 */
height: 4.5rem;                 /* 高さは調整 */
display: flex;
align-items: center;
justify-content: center;
border-radius: 4rem / 2rem;   /* 両端が丸くなる帯っぽさ */
position: relative;
margin: 1rem 0 0.5rem;
}

/* 中央の下向き三角矢印 */
.arrow-bar__chev {
display: block;
width: 0;
height: 0;
border-left: 6rem solid transparent;   /* 左辺 */
border-right: 6rem solid transparent;  /* 右辺 */
border-top: 2.7rem solid #9be0ed;         /* 矢印の色 */
}

.features .feature__cta-lead {
text-align: center;
color: #fff;
}

.features__hero_box2 h3 {
font-size: 2.8rem;
font-weight: bold;
}

.features__hero_box3 {
margin-top: 0.9rem;
}

.features__hero_box3 h3 span {
font-size: 3.4rem;
color: #333442;
}

.features__hero_box3 img {
width: 21rem;
display: block;
margin: 0 auto;
}


.features__content {
background-color: #00ADEA;
border-radius: 4rem;
padding: 4rem 2.4rem;
width: 95%;
margin: 0 auto;
padding-bottom: 0;
}

.features__card-title {
color: #fff;
font-size: 3.4rem;

}

.features__content {
position: relative;
}

.features__card-content {
position: absolute;
  top: 26.5rem;
  left: 0;
  z-index: 0;
  /* width: 37rem; //カラムからはみ出してレイアウトが崩れるため削除 */
}

.features__card-title .features__card-title-span {
color: var(--white, #FFF);
font-feature-settings: 'palt' on;

/* title_4L */
font-family: "Noto Sans JP";
font-size: 5rem;
font-style: normal;
font-weight: 900;
line-height: 125%; /* 6.25rem */
}

.features__card-title span {
color: #00ADEA;
font-size: 3.5rem;
line-height: 1.3;
}

.features__card-title span span {
letter-spacing: -0.5rem;
}

.features__card-header_mb {
margin-bottom: 25rem;
}

.features__card-header p {
font-size: 2rem;
letter-spacing: -0.2rem;
font-weight: 700;
margin-bottom: 4rem;
}



/* コースタブ */
.course-tabs {
display: flex;
justify-content: space-between;

}
.course-tabs__item {
flex: 1;
text-align: center;
padding: 0.75rem;
font-size: 1.2rem;
font-weight: 700;
color: #fff;
background: #3abaf0;
border-radius: 18px 18px 10px 10px;
line-height: 1.4;
margin-bottom: 3px;
}

.course-tabs__item:nth-child(2) {
  margin: 0 0.4rem;
  margin-bottom: 3px;
}
.course-tabs__item--active {
background: #E7F2FE; /* アクティブ状態を強調 */
color: #333442;
border-radius: 1.5rem 1.5rem 0 0;
margin-bottom: 0;
}

.course-tabs__item--active.course-tabs__item:nth-child(2) {
  margin-bottom: 0px;
}

.course-tabs__item span {
display: block;
font-size: 1.2rem;
font-weight: 400;
}

/* 学習時間の目安 */
.course-summary {
margin-bottom: 1.5rem;
}
.course-summary__text {
color: #008ED8;
font-size: 1.4rem;
margin-bottom: 0.5rem;
}
.course-summary__note {
font-size: 1.2rem;
color: #666;
margin: 0;
padding-left: 1.2rem;
}

/* 授業カード */
.lesson-card {
border-radius: 0.8rem;
margin-bottom: 1.5rem;
}
.lesson-card__header {
background-color: #00ADEA;
margin-bottom: 0;
display: flex;
align-items: center;
padding: 0.6rem;
border-radius: 2rem 2rem 0 0;
position: relative;
justify-content: center;
}
.lesson-card__label {
background: #fff;
color: #00ADEA;
font-size: 1.2rem;
font-weight: 700;
padding: 0.3rem 0.6rem;
border-radius: 99.9rem;
margin-right: 0.5rem;
border: solid 0.1rem #00ADEA;
text-align: center;
position: absolute;
left: 0;
}
.lesson-card__label--blue {
  background: #3abaf0;
}
.lesson-card__label--small {
  padding: 0.8rem 0.7rem;
}
.lesson-card__title {
font-size: 1.4rem;
font-weight: 700;
color: #333;
margin-left: 1.5rem;
}
.lesson-card__image img {
width: 100%;
border-radius: 0.6rem;

}
.lesson-card__desc {
  font-size: 1.5rem;
  color: #444;
  line-height: 1.5;
  letter-spacing: -0.02rem;
  margin-top: 10px;
}

.course_block {
background-color: #E7F2FE;
padding: 3.2rem 2rem;
border-radius: 0 0 4rem 4rem;
}

.course-summary__text {
font-size: 1.8rem;
margin-top: 0;
}

.course-summary__note {
list-style: none;
padding-left: 0;
}

.course-summary__note li {
font-size: 1.1rem;
font-weight: 400;
}

.lesson-card__title {
font-size: 1.4rem;
color: #fff;
}

.features__card2 {
background-color: #fff;
border-radius: 3.2rem;
padding: 2rem 1.6rem 3rem;
margin-bottom: 2.4rem;
position: relative;
z-index: 9;
}

.features__card2:last-child {
  margin-bottom: 0;
}

.features__card2 .features__card-title {
color: #333442;
margin-top: 0;
font-size: 2.8rem;
margin-bottom: 1rem;
}

.features__card2_proccess {
position: relative;
}

.features__card2_everymonth {
position: absolute;
width: 8.9rem;
left: 1.2rem;
top: 13rem;
}

.features_proccess_tit_sub {
  color: #000;
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-align: center;
margin-top: 1.6rem;
}

.features__card2_voice {
  margin-bottom: 0;
}

.features__card2 .features__card-header p {
  color: #333442;
}
.features__card2--lineup {
  padding: 2.5rem 0;
}

.course_box {
display: flex;
width: 6.4rem;
height: 6.4rem;
justify-content: center;
align-items: center;
gap: 0.8rem;
border-radius: 6.4rem;
background: #F93A6B;
margin: 0 auto;
color: #fff;
margin-top: -2rem;
font-size: 1.6rem;
font-weight: 700;
position: relative;
z-index: 9;
}


.course_block2 {
display: flex;
padding: 4rem 2rem;
flex-direction: column;
align-items: center;
gap: 1.3rem;
align-self: stretch;
border-radius: 3.2rem;
background: var(--BG_blue, #E7F2FE);
position: relative;
z-index: 1;
margin-top: -3rem;
}


.course_block2 h3 {
color: var(--1, #39F);
text-align: center;
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */
}



.course_block2 a {
display: flex;
width: 24rem;
height: 4.4rem;
padding: 0.6rem 2.9rem;
justify-content: center;
align-items: center;
gap: 0.8rem;
border-radius: 3.2rem;
border: 0.2rem solid var(--0-guide, #008ED8);
background: var(--white, #FFF);
color: var(--0-guide, #008ED8);
font-feature-settings: 'palt' on;

/* label_bold_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.08rem */
text-decoration: none;
}

.course_block2 .enrollment-delivery-card {
  display: flex;
width: 24rem;
height: 4.4rem;
padding: 0.6rem 2.9rem;
justify-content: center;
align-items: center;
gap: 0.8rem;
border-radius: 3.2rem;
border: 0.2rem solid var(--0-guide, #008ED8);
background: var(--white, #FFF);
color: var(--0-guide, #008ED8);
font-feature-settings: 'palt' on;

/* label_bold_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 700;
text-decoration: none;
box-shadow: none;
max-width: 100%;
}

.course_block3_txt {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */
margin-top: 4rem;
margin-bottom: 1rem;
}

.course_block3_title {
color: var(--2, #00ADEA);
font-feature-settings: 'palt' on;

/* title_LL */
font-family: "Noto Sans JP";
font-size: 3.8rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 5.2rem */
margin-top: 0;
margin-bottom: 1.5rem;

}

.course_block3_txt2 {
color: #000;
font-family: Inter;
font-size: 1.6rem;
font-style: normal;
font-weight: 400;
line-height: normal;
line-height: 1.2;
margin-bottom: 1.5rem;
}

.course_block3_img {
  margin-top: 2rem;
}

.features__card2_proccess h3 {
color: var(--2, #00ADEA);
font-feature-settings: 'palt' on;

/* title_3L */
font-family: "Noto Sans JP";
font-size: 4rem;
font-style: normal;
font-weight: 900;
line-height: 125%; /* 5.5rem */
margin-bottom: 3.2rem;
}

.features_proccess {
border-radius: 2.4rem;
background: var(--BG_blue, #E7F2FE);
padding: 2rem;
margin-bottom: 3.2rem;
}

.features_proccess_txt {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* body_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 2.4rem */
margin: 1.4rem 0;
}

.features_proccess_txt2 {
color: var(--sub3, #9A9BA5);
font-feature-settings: 'palt' on;

/* label_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 500;
line-height: 130%; /* 2.08rem */
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: auto;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;
background-color: transparent;
box-shadow: none;
max-width: 100%;
}

.features_proccess2 {
border-radius: 2.4rem;
background: var(--2, #00ADEA);
}

.features_proccess2 h3 {
color: var(--white, #FFF);
font-feature-settings: 'palt' on;

/* title_M */
font-family: "Noto Sans JP";
font-size: 2.8rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 3.64rem */
margin-top: 0;
}

.features_proccess2 h3 span {
  color: var(--white, #FFF);
font-feature-settings: 'palt' on;
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 26px */
display: block;
}

.features_proccess2 .features_proccess_txt {
color: var(--white, #FFF);
font-feature-settings: 'palt' on;

/* body_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 2.4rem */
}

.features__card2_scroll_box .features__card2_scroll_box_caution {
  margin-top: 0;
}

.features__card2_scroll_box_caution a {
  display: block;
  color: var(--sub3, #9A9BA5);
text-align: center;
font-feature-settings: 'palt' on;

/* label_SS */
font-family: "Noto Sans JP";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 130%; /* 15.6px */
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: auto;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;
text-align: left;

}

.features_proccess2 h4 {
color: var(--white, #FFF);
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 1.9rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */
margin-bottom: 1rem;
}

.features__card2 .features_proccess_graf {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_L */
font-family: "Noto Sans JP";
font-size: 3.2rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 4.42rem */
}

.features__card2 .features_proccess_graf span {
color: var(--2, #00ADEA);
font-feature-settings: 'palt' on;

/* title_S */
font-family: "Noto Sans JP";
font-size: 2.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 3.12rem */
display: block;
}

.features__card2 .features__card2_title {
color: var(--2, #00ADEA);
font-feature-settings: 'palt' on;

/* title_L */
font-family: "Noto Sans JP";
font-size: 3.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 4.42rem */
margin-bottom: 3.2rem;
}


.features__card2_voice h3 {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_L */
font-family: "Noto Sans JP";
font-size: 3.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 4.42rem */
margin-bottom: 0;
margin-bottom: 2rem;
}

.features__card2_voice .features_voice {
display: flex;
align-items: center;
}

.features_voice img {
width: 8.3rem;
height: 8.3rem;
margin-right: 1.6rem;
}

.features_voice h4 {
color: var(--main, var(--ink-text-100, #181B35));
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */

}

.features_voice h4 span {
color: var(--sub2, #676979);
font-feature-settings: 'palt' on;

/* label_bold_S */
font-family: "Noto Sans JP";
font-size: 1.4rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 1.82rem */
}

.features__card2_voice p {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* body_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 2.4rem */
margin-top: 2rem;
}

.feature__cta_voice p {
color: #fff;
}
.feature2_wrap {
  background-color: #008ED8;
}
.features2 {
padding: 0 2.4rem;
padding-bottom: 4rem;
margin-top: 5rem;
border-radius: 0 0 3.2rem 3.2rem;
background-color: #E7F2FE;
}

.features2 .feature__title {
color: var(--1, #39F);
font-feature-settings: 'palt' on;

/* title_3L */
font-family: "Noto Sans JP";
font-size: 4.4rem;
font-style: normal;
font-weight: 900;
line-height: 125%; /* 5.5rem */
}



.features2 .feature__subtitle {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_S */
font-family: "Noto Sans JP";
font-size: 2.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 3.12rem */
}


.features2 h3 {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_S */
font-family: "Noto Sans JP";
font-size: 2.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 3.12rem */
margin: 4rem 0 2.8rem;
}


.features2 h3 span {
color: var(--0-guide, #008ED8);
font-feature-settings: 'palt' on;

/* title_LL */
font-family: "Noto Sans JP";
font-size: 3.8rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 5.2rem */
}


.features__card2_content h4 {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */
margin-top: 0;
margin-bottom: 1.4rem;
}

.features__card2_content h4 span {
color: var(--0-guide, #008ED8);
font-feature-settings: 'palt' on;

/* title_L */
font-family: "Noto Sans JP";
font-size: 3.4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 4.42rem */


}

.features__card2_content h5 {
  color: #000;
  font-family: "Hiragino Kaku Gothic Std";
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
  margin-bottom: 1.6rem;
  text-align: center;
}
.features__card2_content h5 .features__card2_hLead {
  color: #008ED8;
  font-feature-settings: 'palt' on;

  font-family: "Noto Sans JP";
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%; /* 1.82rem */
}


.features__card2_content img {
margin-bottom: 1rem;
}

.features__card2_content  p {
font-size: 1.6rem;
}


.features__card2_scroll {
display: flex;
    gap: 2rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 1.5rem 0;
}

.features__card2_scroll_box {
flex: 0 0 85%;
max-width: 27rem;
padding: 1.2rem 0 1.2rem;
scroll-snap-align: start;
}

.features__card2_scroll_box img {
width: 100%;
max-width: 27rem;
height: 18.3rem;
}

.features__card2_scroll_box p {
font-size: 1.6rem;
margin-top: 1rem;
letter-spacing: -0.01rem;
margin-bottom: 0;
}

.about_library {
color: var(--10, #00219B);
font-feature-settings: 'palt' on;

/* label_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 500;
line-height: 130%; /* 2.08rem */
margin: 1.2rem 0;
}

.features__card2_content .about_library_txt {
color: var(--sub2, #676979);
font-feature-settings: 'palt' on;

/* caption_s */
font-family: "Noto Sans JP";
font-size: 1.4rem;
font-style: normal;
font-weight: 400;
line-height: 130%; /* 1.82rem */
}


.features3 {
padding: 5.6rem 2rem;
background: #E7F2FE;
border-radius: 3.2rem 3.2rem 0 0;
}

.features3 .feature__title {
color: var(--1, #39F);
font-feature-settings: 'palt' on;

/* title_3L */
font-family: "Noto Sans JP";
font-size: 4.4rem;
font-style: normal;
font-weight: 900;
line-height: 125%; /* 5.5rem */
margin-bottom: 4rem;
}

.feature_cta_bg {
  background-color: #008ED8;
}

.features3 .feature__title span {
color: var(--1, #39F);
font-feature-settings: 'palt' on;

/* title_M */
font-family: "Noto Sans JP";
font-size: 2.8rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 3.64rem */
}

.features3 .features3_lineup {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_LL */
font-family: "Noto Sans JP";
font-size: 4rem;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 5.2rem */
margin-bottom: 0;
margin-top: 4.8rem;
margin-bottom: 1rem;
}

.features3_lineup_txt {
color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* lead */
font-family: "Noto Sans JP";
font-size: 2rem;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 2.8rem */
margin-bottom: 2.8rem;
}


.feature_lineup_txt3 {
color: var(--0-guide, #008ED8);
text-align: center;
font-family: "Hiragino Kaku Gothic ProN";
font-size: 1.94rem;
font-style: normal;
font-weight: 600;
line-height: 2.8rem; /* 144.516% */
}

.feature3_challenge_touch {
border-radius: 3.2rem;
background: var(--additional_blue, #2698FA);
padding: 2.4rem 2.4rem 1.2rem 2.4rem;
}

.feature3_challenge_touch > img {
margin-bottom: 1rem;
}

.feature3_challenge {
border-radius: 3.2rem;
background: var(--3, #34BBD8);
padding: 3.2rem .6rem 1rem;
margin-top: 1.2rem;
}

.feature3_challenge > img {
margin-bottom: 1rem;
}


.features3 .enrollment-container {
width: 100%;
margin-top: 2.8rem;
}

/* footerの指定は共通CSSを参照 */
.footer__list {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
list-style: none;
padding-left: 0;
margin: 0;
}

.footer__list li {
background: var(--BG-_main, #F4F4F2);
padding: 1.6rem 2rem;
}

.footer__list li a {
color: var(--text, #414358);
font-feature-settings: 'palt' on;
/* label_bold_M */
font-family: "Noto Sans JP";
font-size: 1.4rem;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 2.6rem */
text-decoration: none;
}

.features__container_renewal {
  -webkit-text-stroke-width: 1.31px;
-webkit-text-stroke-color: var(--white, #FFF);
font-family: Inter;
font-size: 63.231px;
font-style: normal;
font-weight: 800;
line-height: normal;
color: #34BBD8;
opacity: 0.4;
position: absolute;
top: 10px;
width: 299px;
right: 10px;
}

.innerPcScroll--child_left {
  display: none;
}

.innerPcScroll--parent .innerPcScroll--child {
  width: 100%;
}

.feature__cta_wh p {
  color: #fff;
}

.features__card2_pb {
  padding-bottom: 0;
}

.c-requestButton__a {
  max-width: 31.2rem;
  margin: 0 auto;
  margin-top: 5px;
}

.c-requestButton__span {
  font-size: 2rem;
  text-align: left;
}

.enrollment-delivery-card p {
  color: #333442;
  margin: 0;
  font-size: 1.3rem;
}

.enrollment-delivery-card p span {
  color: #676979;
  font-size: 1rem;
}




.modal {
  display: none;              /* 初期状態は非表示 */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6); /* 背景半透明 */
  justify-content: center;    /* flex用：中央寄せ */
  align-items: center;        /* flex用：縦中央寄せ */
  z-index: 9999;
  overflow-y: auto;           /* はみ出たときスクロール可能 */
}

.modal__content {
  background: #fff;
  border-radius: 32px;
  max-width: 600px;
  width: 95%;
  max-height: 90vh; /* ← 画面に収まる高さを指定 */
  overflow-y: auto; /* ← コンテンツ部分だけスクロール可能に */
  padding: 2rem;
  position: relative;
}

.modal__close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  font-size: 2rem;
  cursor: pointer;
  color: var(--text, #333442);
}

.modal_block h2 {
  color: var(--text, #333442);
font-feature-settings: 'palt' on;

/* title_S */
font-family: "Noto Sans JP";
font-size: 24px;
font-style: normal;
font-weight: 900;
line-height: 130%; /* 31.2px */
margin: 1.6rem 0;
}

.modal_block p {
  color: var(--text, #333442);
font-feature-settings: 'palt' on;
/* body_base */
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 24px */
}

.modal_block {
  margin-top: 2.4rem;
}


.feature1_inner { display: none; }
.feature1_inner1 { display: block; }

/* ハンバーガメニュー中身 */
/* .c-menu {
  display: none;
} */

.c-menu-wrap {
  position: fixed;
  top: 0;
  right: 0;
  box-sizing: border-box;
  z-index: 10000;
}

.c-menu__overlay {
  width: 100vw;
  height: 100vh;
  margin: auto;
  background: rgba(183, 183, 183, .9);
  opacity: 0;
  position: absolute;
  top: 0;
  right: -100vw;
  z-index: 10010;
  transition: opacity .3s, right .3s .3s;
}

.c-menu__overlay--show {
  right: 0;
        opacity: 1;
        transition: opacity .3s;
}

.c-menu-cont--open {
  right: 0;
}

.c-menu-cont {
  width: 85.33333333vw;
  height: 100vh;
  margin: auto;
  padding: 0 5.33333333vw 8vw;
  background: #fff;
  border-radius: 1.33333333vw 0 0 1.33333333vw;
  position: absolute;
  top: 0;
  right: -85.33333333vw;
  overflow: auto;
  box-sizing: border-box;
  z-index: 10020;
  transition: right .3s;
}

.c-menu-cont-head {
  display: flex;
  align-items: center;
  min-height: 16vw;
  margin: 0 -5.33333333vw 8vw;
  padding: 3vw 4vw 3vw 5.33333333vw;
}

.c-menu-logos {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.c-menu-close-btn {
  color: #55a7ed;
  font-weight: 700;
  text-align: center;
  position: relative;
}

.c-menu-close-btn--top {
  width: 12vw;
  height: 12vw;
  margin-left: auto;
  padding: 7.2vw 0 0;
  font-size: 2.66666667vw;
}

.c-menu-close-btn::after, .c-menu-close-btn::before {
  content: "";
  display: block;
  width: 5.76888204vw;
  height: .53333333vw;
  margin: auto;
  background: #55a7ed;
  border-radius: .26666667vw / 50%;
  position: absolute;
}

.c-menu-close-btn--top::after, .c-menu-close-btn--top::before {
  top: 3.2vw;
  right: 0;
  left: 0;
}

.c-menu-close-btn::before {
  transform: rotateZ(34deg);
}

.c-menu-close-btn--top::after, .c-menu-close-btn--top::before {
  top: 3.2vw;
  right: 0;
  left: 0;
}

.c-menu-cont--open {
  right: 0;
}

.c-menu-cont-foot {
  margin-top: 8vw;
  padding: 0 2.66666667vw;
}

.c-menu-link__list--has-link {
  padding: 1.33333333vw 4.26666667vw;
  border-left: .8vw solid #464646;
  color: #464646;
  font-size: 3.73333333vw;
  font-weight: 700;
  position: relative;
}

.c-menu-link__list--has-link {
  padding: 0;
  border-left: none;

}

.c-menu-link__link {
  display: block;
        padding: 1.33333333vw 8.53333333vw 1.33333333vw 4.26666667vw;
        border-left: .8vw solid #464646;
        color: #464646;
        text-decoration: none;
        position: relative;
}

.c-menu-link__link.c-menu-link__list--primary {
  cursor: default;
  opacity: 1;
  pointer-events: none;
}

.c-wrap--sho .c-menu-link__list--primary {
  border-color: #55a7ed;
        color: #55a7ed;
}

.c-menu-link__list:not(:first-child) {
  margin-top: 4vw;
}

.c-menu-other-grade {
  display: none;
  margin-top: 4vw;
  padding-left: 4vw;
}

.c-menu-other-grade.c-menu-other-grade--open {
  display: list-item;
}

.c-header__menu-list-link::before {
  content: "";
  border-radius: 1.33333333vw;
  background-color: #464646;
  width: 1.06666666vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.c-header__menu-list-link {
  display: block;
  font-size: 3.73333333vw;
  font-weight: 700;
  color: #464646;
  text-align: left;
  line-height: 1.5;
  text-decoration: none;
  padding: 1.6vw 8vw 1.6vw 4.26666666vw;
  position: relative;
}

.c-header__menu-list-link::after {
  content: "";
  background-image: url(../img/c-arrow--black.svg);
  background-repeat: no-repeat;
  width: 1.86666666vw;
  height: 2.66666666vw;
  margin-top: auto;
  margin-bottom: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3.73333333vw;
}

.c-wrap--sho .c-menu-link__link--other-grade::after {
  width: 10px;
  height: 10px;
  background-image: url(../img/c-arrow--black.svg);
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.c-menu-btn__link {
  display: block;
  padding: 3.46666667vw 10.13333333vw 3.46666667vw 4.26666667vw;
  border-radius: 1.33333333vw;
  font-size: 3.73333333vw;
  font-weight: 700;
  text-decoration: none;
  position: relative;
}

.c-menu-btn__link--cv {
  color: #444;
  background: #fff039;
}

.c-header__menu-trial-link {
  display: block;
  border-radius: 1.33333333vw;
  border: solid 2px #005BAC;
  font-size: 3.73333333vw;
  font-weight: 700;
  color: #005BAC;
  text-align: left;
  line-height: 1;
  text-decoration: none;
  margin-bottom: 5.33333333vw;
  padding: 3.73333333vw 8vw 3.73333333vw 3.73333333vw;
  position: relative;
}



.c-header__menu-trial-link.c-header__menu-trial-link--touch_taiken {
  border-color: #f8873b;
    color: #f8873b;
}

.c-menu-link__link::after {
  content: "";
  width: 2.66666666vw;
  height: 2.66666666vw;
  margin: auto;
  background-image: url(../img/c-arrow--black.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  top: 0;
  right: 3.46666667vw;
  bottom: 0;
}

.c-wrap--sho .c-menu-link__link--other-grade::after {
  width: 10px;
  height: 10px;
  background-image: url(../img/c-plus--black.svg);
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.c-menu-wrap {
  display: none;
}

.campaign-banner .enrollment-delivery-card {
  padding: 0;
    max-width: 100%;
    flex: auto;
    box-shadow: none;
}

.modal_tablet_img {
  display: block;
}

.modal_tablet h3 {
  color: #000000;
  font-size: 1.4rem;
  font-weight: 700;
}

.modal_tablet p {
  font-size: 1.2rem;
  font-weight: 700;
}

.modal_tablet_img1 {
  width: 33rem;
}

.modal_tablet_img2 {
  width: 34rem;
}

.modal__content_tablet {
  border-radius: 0;
  padding: 3rem;
}

.modal_tablet ul li {
  font-size: 1rem;
  color: #888888;
}

.modal_tablet ul li::before {
  content: "※";
}


.subject-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  line-height: 1.6;
  margin: 1.5rem 0;
}

/* 見出し行 */
.subject-table thead th {
  background-color: #006884;
  color: #fff;
  text-align: left;
  padding: 8px 12px;
  font-weight: 700;
}

/* 教科名列 */
.subject-table th {
  background-color: #d9dde0;
  width: 10%;
  text-align: left;
  padding: 8px 12px;
  font-weight: 700;
  vertical-align: top;
}

/* 出版社列 */
.subject-table td {
  background-color: #eef0f2;
  padding: 8px 12px;
  vertical-align: top;
}

/* 枠線 */
.subject-table th,
.subject-table td {
  border: 1px solid #ccc;
}

.features__card2_scroll_box .enrollment-delivery-card {
  background-color: transparent;
  box-shadow: none;
  max-width: 100%;
  text-decoration: underline;
}

/* レスポンシブ微調整 */
@media (min-width:900px){
  .hero-inner{padding:2.6rem 2.8rem}
  .deadline{padding:1.8rem 2.2rem}
}


@media screen and (min-width: 471px) {
  .modal_tablet_img {
    display: flex;
    justify-content: space-around;
  }
  .hero__container {
    display: none;
  }
  .enrollment-container {
    margin-top: 3.3rem;
  }
  .innerPcScroll--parent {
    position: relative;
  }
  
  .innerPcScroll--child_left {
    display: block;
 
    max-width: 42.5rem;
  
  }
  

  
  .innerPcScroll--child_left .nyukai_kento {
    color: #FFF;
    text-align: center;
    font-feature-settings: 'palt' on;
  
    /* label_bold_L */
    font-family: "Noto Sans JP";
    font-size: 2.4rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%; /* 3.12rem */
    margin-top: 1.6rem;
  }
  
  .innerPcScroll--child_left .footer__relationLinkA {
    margin-top: 13.8rem;
    width: 27.8rem;
  }
  
  .innerPcScroll--child_left_new1 {
    color: var(--1, #39F);
    font-family: "Noto Sans JP";
    font-size: 2.3rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 1.6rem;
  }
  
  .innerPcScroll--child_left .feature-list {
    width: 31rem;
    margin-top: 1.7rem;
  }
  
  .innerPcScroll--child_left .feature-list__title {
    font-size: clamp(1.8rem, .8vw, 2.4rem);
  }
  
  .innerPcScroll--child_left .feature__cta_voice p {
    color: #333442;
  }
  
  .innerPcScroll--child_left .feature__cta {
    width: 33rem;
  }
  
  .innerPcScroll--child_left_box {
    padding-left: 5rem;
  }
  .innerPcScroll--child_left {
    background-color: transparent;
  }
  .hero__title {
    text-align: left;
    padding-left: 13rem;
  }
  .innerPcScroll--child_left .footer__relationLinkA 
  {
    margin-top: 0;
  }
  .innerPcScroll--child_left {
    margin-top: 76rem;
  }
}