@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*YouTube動画の中央配置*/
.video-container{
	margin: 0px auto;
}

/* 記事内画像キャプションのデザイン変更 */
figcaption {
text-align : right;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/************************************
** 人気記事 タイトル
************************************/
.widget-entry-card {
font-size: 14px;
line-height: 1.5em;
font-weight: lighter;
}

:root{
  --gl-bg:#F4F6F7;   --gl-ink:#1B2B3A;  --gl-body:#333E48;
  --gl-teal:#1D6A63; --gl-brass:#8A7434; --gl-cta:#1E3A56;
  --gl-line:#E1E6EA; --gl-sub:#64707B;
  --gl-head:'Zen Kaku Gothic New',sans-serif;
  --gl-sans:'Noto Sans JP',sans-serif;
  --gl-mono:'IBM Plex Mono',monospace;
}
body{background:var(--gl-bg);color:var(--gl-body);font-family:var(--gl-sans)}
a{color:var(--gl-teal)}
h1,h2,h3,h4{font-family:var(--gl-head);color:var(--gl-ink)}

.page .sns-share,
.page .sns-follow {
    display: none;
}

/* ===== ヒーロー（5a） ===== */
.gl-hero{position:relative;overflow:hidden;background-color:#FBFCFC;
  background-image:linear-gradient(rgba(27,43,58,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(27,43,58,.04) 1px,transparent 1px);
  background-size:64px 64px}
/* 円弧は大きく薄く、背景に沈める */
.gl-hero::before,.gl-hero::after{content:"";position:absolute;border-radius:50%;
  border:1px solid rgba(29,106,99,.13);pointer-events:none}
.gl-hero::before{right:-200px;top:-160px;width:760px;height:760px}
.gl-hero::after{right:-120px;top:-60px;width:560px;height:560px;
  border-color:rgba(29,106,99,.10)}
.gl-hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;
  gap:56px;align-items:center;max-width:1280px;margin:0 auto;padding:60px 48px 0}

/* キッカー：2語を下線で区切る */
.gl-kicker{display:flex;align-items:baseline;gap:12px;margin:0 0 22px;
  font:500 12.5px var(--gl-mono);letter-spacing:.14em;color:var(--gl-teal)}
.gl-kicker span{border-bottom:2px solid var(--gl-teal);padding-bottom:5px}
.gl-kicker span+span{border-bottom-color:#D8E4E1}
.gl-kicker i{font-style:normal;color:#9FB8B4}

.gl-h1{font:900 44px/1.42 var(--gl-head);color:var(--gl-ink);margin:0}
.gl-lead{font:400 15.5px/2.05 var(--gl-sans);color:#4A555F;margin:22px 0 0;
  max-width:540px}
.gl-btns{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.gl-btn{font:700 15px var(--gl-sans);padding:14px 24px;border-radius:7px;
  text-decoration:none;display:inline-flex;align-items:center;gap:10px}
.gl-btn i{font-style:normal;font-family:var(--gl-mono);font-weight:400}
/* 主役ボタンは緑。ネイビーは教員向けスライド案内に予約 */
.gl-btn-primary{background:var(--gl-teal);color:#fff!important}
.gl-btn-ghost{background:#fff;color:var(--gl-ink)!important;
  border:1.5px solid #DBE2E6;padding:13px 23px}

/* 動画カード：内側に余白を持たせて額装に見せる */
.gl-hero-video{background:#fff;border:1px solid #E4E9EC;border-radius:14px;
  padding:10px;box-shadow:0 6px 24px rgba(27,43,58,.07)}
.gl-video-frame{aspect-ratio:16/9;background:#16222E;border-radius:9px;
  overflow:hidden}
.gl-video-frame iframe{width:100%;height:100%;border:0;display:block}
.gl-video-meta{padding:14px 10px 6px;display:flex;align-items:center;gap:12px}
.gl-ch{flex:1;font:700 13.5px var(--gl-head);color:var(--gl-ink)}
.gl-ch small{display:block;font:400 11.5px var(--gl-sans);color:var(--gl-sub);
  margin-top:2px}
.gl-ch-btn{background:#fff;color:var(--gl-ink)!important;border:1.5px solid #DBE2E6;
  font:700 12.5px var(--gl-sans);padding:9px 16px;border-radius:6px;
  text-decoration:none;white-space:nowrap}

/* 統計：独立した白カード（数値→ラベル→一言説明の3段） */
.gl-stats{position:relative;display:grid;grid-template-columns:repeat(3,1fr);
  max-width:1280px;margin:44px auto 0;padding:0 48px 56px;box-sizing:border-box}
.gl-stat{background:#fff;border:1px solid #E4E9EC;padding:26px 32px}
.gl-stat:first-child{border-radius:12px 0 0 12px;border-right:0}
.gl-stat:last-child{border-radius:0 12px 12px 0;border-left:0}
.gl-stat:nth-child(2){border-left:1px solid #EDF0F2;border-right:1px solid #EDF0F2}
.gl-stat b{display:block;font:900 30px/1 var(--gl-head);color:var(--gl-teal)}
.gl-stat b em{font-style:normal;font-size:20px}
.gl-stat strong{display:block;font:700 14.5px var(--gl-head);
  color:var(--gl-ink);margin-top:7px}
.gl-stat span{display:block;font:400 12px var(--gl-sans);
  color:var(--gl-sub);margin-top:5px}

@media(max-width:900px){
  .gl-hero-grid{grid-template-columns:1fr;gap:32px;padding:44px 24px 0}
  .gl-h1{font-size:30px}
  .gl-btn{width:100%;justify-content:center}
  .gl-stats{grid-template-columns:1fr;margin-top:32px;padding:0 24px 40px}
  .gl-stat{border-radius:0!important;border:1px solid #E4E9EC!important;
    border-bottom:0!important;padding:20px 24px}
  .gl-stat:first-child{border-radius:12px 12px 0 0!important}
  .gl-stat:last-child{border-radius:0 0 12px 12px!important;
    border-bottom:1px solid #E4E9EC!important}
}


/* ===== 単元カード（2c）— 写真は上部110pxの帯に限定 ===== */
.gl-units{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  max-width:1280px;margin:0 auto;padding:0 64px 72px}
.gl-unit{background:#fff;border:1px solid var(--gl-line);border-radius:10px;
  overflow:hidden;display:block;text-decoration:none;
  transition:box-shadow .15s ease}
.gl-unit:hover{box-shadow:0 4px 16px rgba(27,43,58,.12)}
.gl-unit-band{position:relative;height:110px}
.gl-unit-band img{width:100%;height:100%;object-fit:cover;display:block}
.gl-unit-band::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(27,43,58,.18) 0%,
    rgba(27,43,58,.02) 55%,rgba(255,255,255,.9) 100%)}
.gl-unit-no{position:absolute;left:16px;top:12px;z-index:1;
  font:500 10.5px var(--gl-mono);color:#fff;
  background:rgba(27,43,58,.72);padding:3px 9px;border-radius:99px}
.gl-unit-body{padding:14px 20px 20px}
.gl-unit-body h3{font:700 17px/1.5 var(--gl-head);color:var(--gl-ink);margin:0}
.gl-unit-body p{font:400 12.5px/1.75 var(--gl-sans);color:var(--gl-sub);margin:5px 0 0}
.gl-unit-foot{display:flex;align-items:center;margin-top:13px}
.gl-unit-count{font:500 11px var(--gl-mono);color:var(--gl-sub);
  border:1px solid var(--gl-line);padding:3px 9px;border-radius:99px}
.gl-unit-go{margin-left:auto;font:700 12.5px var(--gl-sans);color:var(--gl-teal)}
@media(max-width:1000px){.gl-units{grid-template-columns:repeat(2,1fr);padding:0 24px 48px}}
@media(max-width:640px){.gl-units{grid-template-columns:1fr}}


/* ===== 大単元ページ（7a） ===== */
/* ヒーローは白、それ以降は薄グレー。方眼はヒーローから先へ引き継がない */
.gl-uhero{position:relative;display:grid;grid-template-columns:46% 54%;
  align-items:center;min-height:360px;background:#fff;overflow:hidden;
  border-bottom:1px solid var(--gl-line)}
.gl-uhero::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(27,43,58,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(27,43,58,.035) 1px,transparent 1px);
  background-size:64px 64px}
.gl-uhero-text{position:relative;z-index:1;padding:24px 32px}
.gl-uhero-bc{font:400 13px var(--gl-sans);color:var(--gl-sub);margin:0}
.gl-uhero-bc a{color:var(--gl-sub)}
.gl-uhero-no{font:500 12px var(--gl-mono);letter-spacing:.16em;
  color:var(--gl-teal);margin:22px 0 0}
.gl-uhero h1{font:700 44px/1.3 var(--gl-head);color:var(--gl-ink);margin:8px 0 0}
.gl-uhero-lead{font:400 16px/1.75 var(--gl-sans);color:#4A555F;
  margin:14px 0 0;max-width:460px}
.gl-uhero-meta{display:flex;gap:18px;list-style:none;padding:0;margin:16px 0 0;
  font:400 13.5px var(--gl-sans);color:#4A555F}
.gl-uhero-meta li+li{border-left:1px solid var(--gl-line);padding-left:18px}
.gl-uhero-cta{display:flex;gap:12px;margin:22px 0 0;flex-wrap:wrap}
.gl-uhero-kv{position:relative;align-self:stretch}
.gl-uhero-kv img{width:100%;height:100%;object-fit:cover;display:block}
.gl-uhero-kv::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.6) 14%,
    rgba(255,255,255,0) 36%)}

/* ===== レッスン一覧：カードの集合ではなく教材カタログ ===== */
.gl-lessons{max-width:1180px;margin:0 auto;padding:44px 32px 40px;
  background:#F8FAFB}
.gl-lessons-head{display:flex;align-items:flex-end;gap:11px}
.gl-lessons-h{display:flex;align-items:center;gap:11px;flex:1;
  font:700 26px var(--gl-head);color:var(--gl-ink);margin:0}
.gl-lessons-h::before{content:"";width:4px;height:24px;background:var(--gl-teal);
  border-radius:2px}
/* 列見出しは一度だけ——各行でラベルを繰り返さない */
.gl-lessons-cols{display:flex;flex:none;font:400 12.5px var(--gl-sans);
  color:var(--gl-sub)}
.gl-lessons-cols span{width:130px}
.gl-lessons-cols span+span{width:120px}
.gl-lesson-list{background:#fff;border:1px solid var(--gl-line);
  border-radius:10px;margin-top:14px;overflow:hidden}
/* 行全体をリンクにする。行の中に別のリンクを入れない */
.gl-lesson-row{display:flex;align-items:center;padding:16px 22px;
  min-height:76px;box-sizing:border-box;text-decoration:none;
  border-bottom:1px solid #EDF0F2;transition:background .15s,box-shadow .15s}
.gl-lesson-row:last-child{border-bottom:0}
.gl-lesson-row:hover{background:#F5FAF9;box-shadow:inset 0 0 0 1.5px var(--gl-teal)}
.gl-lesson-row:hover .gl-lesson-ttl{color:var(--gl-teal)}
.gl-lesson-row:focus-visible{outline:2px solid var(--gl-teal);outline-offset:2px}
.gl-lesson-no{width:56px;flex:none;font:700 21px var(--gl-head);
  color:var(--gl-teal)}
.gl-lesson-main{flex:1;padding-right:20px}
.gl-lesson-ttl{display:block;font:700 17px var(--gl-head);color:var(--gl-ink)}
.gl-lesson-desc{display:block;font:400 13px var(--gl-sans);color:var(--gl-sub);
  margin-top:4px}
.gl-lesson-time{width:130px;flex:none;font:500 13px var(--gl-mono);
  color:var(--gl-body)}
.gl-lesson-quiz,.gl-lesson-mat{width:120px;flex:none;color:var(--gl-teal);
  font:400 13px var(--gl-sans)}
/* PCでは列見出しがあるのでラベル文字は隠し、記号だけにする */
.gl-lesson-quiz .lb,.gl-lesson-mat .lb{display:none}
/* 「なし」はテキストを増やさずダッシュだけ */
.gl-none{color:var(--gl-sub);font:400 14px var(--gl-sans)}
.gl-lessons-note{border:1px solid #D7E5E7;background:#F7FBFB;border-radius:10px;
  padding:18px 22px;margin-top:24px}
.gl-lessons-note strong{display:block;font:700 15px var(--gl-head);
  color:var(--gl-ink)}
.gl-lessons-note span{display:block;font:400 13px/1.8 var(--gl-sans);
  color:#4A555F;margin-top:4px}

@media(max-width:900px){
  .gl-uhero{grid-template-columns:1fr;min-height:0}
  .gl-uhero h1{font-size:32px}
  .gl-uhero-text{padding:14px 18px 20px}
  .gl-uhero-meta{gap:10px;font-size:12px}
  .gl-uhero-meta li+li{padding-left:10px}
  /* スマホはヒーローを縦に長くしない：CTAの後に画像・高さ170px */
  .gl-uhero-kv{order:2;height:170px;margin:0 18px 20px;border-radius:9px;
    overflow:hidden}
  .gl-uhero-kv::after{display:none}
  .gl-lessons{padding:24px 18px 32px}
  .gl-lessons-cols{display:none}
  /* 表を縮小せず縦に再構成。メタはタイトル下へ */
  .gl-lesson-row{flex-wrap:wrap;padding:16px;min-height:0}
  .gl-lesson-no{width:100%;font-size:17px}
  .gl-lesson-main{flex:1 0 100%;padding:0;margin-top:3px}
  .gl-lesson-time,.gl-lesson-quiz,.gl-lesson-mat{width:auto;margin-top:9px;
    margin-right:14px;font-size:12px}
  .gl-lesson-quiz .lb,.gl-lesson-mat .lb{display:inline}
  /* スマホでは「なし」は項目自体を省略 */
  .gl-none{display:none}
}



/* ===== レッスン記事（6a/6b） ===== */
/* コンテナと読み幅 */
.single .content{max-width:1180px}
.single .main{max-width:800px}
.single .entry-content{font:400 16.5px/1.85 var(--gl-sans);color:var(--gl-body)}
.single .entry-content p{margin:0 0 18px}

/* H2：細い青緑ライン。背景色・帯は付けない */
.single .entry-content h2{display:flex;align-items:center;gap:11px;
  font:700 27px var(--gl-head);color:var(--gl-ink);
  background:none;border:0;padding:0;margin:44px 0 20px}
.single .entry-content h2::before{content:"";width:4px;height:26px;
  background:var(--gl-teal);border-radius:2px;flex:none}
.single .entry-content h3{font:700 21px var(--gl-head);color:var(--gl-ink);
  border:0;padding:0;margin:32px 0 14px}

/* レッスンヒーロー */
.gl-lesson-hero{display:grid;grid-template-columns:1fr 400px;gap:40px;
  align-items:center;margin:0 0 40px}
.gl-lesson-meta{display:flex;align-items:center;gap:12px}
.gl-unit-chip{font:500 11px var(--gl-mono);letter-spacing:.12em;
  color:var(--gl-teal);border:1px solid #C9DCD8;border-radius:99px;padding:4px 11px}
.gl-lesson-hero h1{font:700 46px/1.34 var(--gl-head);color:var(--gl-ink);margin:16px 0 0}
.gl-lesson-lead{font:400 15.5px/1.9 var(--gl-sans);color:#4A555F;margin:14px 0 0}
.gl-lesson-facts{display:flex;gap:22px;margin-top:18px;
  font:400 13px var(--gl-sans);color:var(--gl-sub)}
.gl-lesson-kv img{width:100%;border:1px solid var(--gl-line);border-radius:10px;
  display:block}

/* 学習目標・入試のポイント（意味のあるグループだけカード化） */
.gl-objectives,.gl-exam{border:1px solid #D7E5E7;background:#F7FBFB;
  border-radius:10px;padding:22px 26px;margin:0 0 44px}
.gl-objectives h3,.gl-exam h3{font:700 16px var(--gl-head);color:var(--gl-ink);
  margin:0 0 11px;border:0;padding:0}
.gl-objectives ul,.gl-exam ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.gl-objectives li{font:400 14.5px/1.7 var(--gl-sans);color:var(--gl-body);
  padding-left:26px;position:relative}
.gl-objectives li::before{content:"✓";position:absolute;left:0;
  color:var(--gl-teal);font-weight:700}

/* 動画（軽量埋め込み。サムネイル→クリックでiframe） */
.gl-video-h{display:flex;align-items:center;gap:11px;margin:0 0 14px;
  font:700 19px var(--gl-head);color:var(--gl-ink)}
.gl-video-h::before{content:"";width:3px;height:20px;background:var(--gl-teal);
  border-radius:2px}
.gl-lesson-video{position:relative;aspect-ratio:16/9;border-radius:9px;
  overflow:hidden;background:#16222E;cursor:pointer}
.gl-lesson-video img{width:100%;height:100%;object-fit:cover;display:block}
.gl-lesson-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.gl-lesson-video .play{position:absolute;left:50%;top:50%;width:64px;height:64px;
  margin:-32px 0 0 -32px;border-radius:50%;background:#fff;
  box-shadow:0 2px 14px rgba(0,0,0,.25)}
.gl-lesson-video .play::after{content:"";position:absolute;left:25px;top:19px;
  border-left:19px solid #16222E;border-top:13px solid transparent;
  border-bottom:13px solid transparent}
.gl-to-article{display:block;text-align:right;margin-top:10px;
  font:700 13.5px var(--gl-sans);color:var(--gl-teal)}

/* A〜Eの視覚化：スマホは横スクロール */
.gl-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:18px 0 0}
.gl-cat{border:1px solid var(--gl-line);border-radius:9px;padding:16px 12px;
  text-align:center}
.gl-cat b{display:block;font:700 22px var(--gl-head);color:var(--gl-teal)}
.gl-cat strong{display:block;font:700 13px var(--gl-head);color:var(--gl-ink)}
.gl-cat span{display:block;font:400 11.5px/1.6 var(--gl-sans);
  color:var(--gl-sub);margin-top:9px}

/* 図表：枠線主体・Shadowなし */
.gl-figure{margin:16px 0 0}
.gl-figure img{width:100%;border:1px solid #E3E8EC;border-radius:9px;display:block}
.gl-figure figcaption{font:400 12.5px/1.7 var(--gl-sans);color:var(--gl-sub);
  margin-top:9px}
.single .entry-content table{border:1px solid #E3E8EC;border-radius:9px;
  border-collapse:separate;border-spacing:0;overflow:hidden;font-size:13px}
.single .entry-content th{background:#F4F6F7;font-family:var(--gl-sans)}

/* 確認問題CTA＝最強。塗りボタン */
.gl-quiz{border:1px solid #C9DCD8;background:#F7FBFB;border-radius:11px;
  padding:26px 28px;display:flex;align-items:center;gap:22px;margin:44px 0 16px}
.gl-quiz-body{flex:1}
.gl-quiz-body strong{display:block;font:700 19px var(--gl-head);color:var(--gl-ink)}
.gl-quiz-body span{display:block;font:400 13.5px/1.8 var(--gl-sans);
  color:#4A555F;margin-top:5px}
.gl-quiz-btn{background:var(--gl-teal);color:#fff!important;font:700 15px var(--gl-sans);
  padding:14px 24px;border-radius:7px;text-decoration:none;white-space:nowrap}
.gl-quiz-note{display:block;font:400 10.5px var(--gl-sans);color:var(--gl-sub);
  margin-top:6px;text-align:center}

/* 教員向けCTA＝弱い階層。白抜きボタン */
.gl-teacher{border:1px solid #E4E9EC;background:#FAFBFC;
  border-radius:11px;padding:22px 26px;margin:0}
.gl-teacher-row{display:flex;align-items:center;gap:22px}
.gl-teacher-body{flex:1}
.gl-teacher-kicker{font:500 10.5px var(--gl-mono);letter-spacing:.16em;
  color:var(--gl-sub);margin:0}
.gl-teacher h3{font:700 16px var(--gl-head);color:var(--gl-ink);margin:4px 0 0;
  border:0;padding:0}
.gl-teacher p{font:400 13px/1.8 var(--gl-sans);color:var(--gl-sub);margin:4px 0 0}
.gl-teacher-act{display:flex;gap:14px;align-items:center;flex-wrap:wrap;
  margin-top:14px!important}
/* \u30b9\u30e9\u30a4\u30c9\u8868\u7d19\u306e\u30b5\u30e0\u30cd\u30a4\u30eb\uff1a\u4f55\u304c\u5165\u624b\u3067\u304d\u308b\u306e\u304b\u3092\u4e00\u76ee\u3067\u4f1d\u3048\u308b */
.gl-teacher-thumb{flex:none;width:150px}
.gl-teacher-thumb img{width:100%;border-radius:5px;display:block;
  border:1px solid #E1E6EA}
.gl-teacher-student{border-top:1px solid #EDF0F2;margin:16px 0 0;
  padding-top:11px;font:400 11.5px/1.7 var(--gl-sans);color:var(--gl-sub)}
.gl-teacher-btn{background:#fff;color:var(--gl-ink)!important;
  border:1.5px solid #C6CFD6;font:700 13.5px var(--gl-sans);padding:11px 20px;
  border-radius:7px;text-decoration:none;white-space:nowrap}
.gl-teacher-note{display:block;font:400 10.5px var(--gl-sans);color:var(--gl-sub);
  margin-top:6px;text-align:center}

/* 前後＋単元一覧ナビ */
.gl-prevnext{display:grid;grid-template-columns:1fr 1fr 1fr;
  border:1px solid var(--gl-line);border-radius:11px;overflow:hidden;margin:52px 0 0}
.gl-prevnext > *{padding:20px 24px;text-decoration:none;display:block}
.gl-prevnext > *+*{border-left:1px solid #EDF0F2}
.gl-prevnext small{font:400 11.5px var(--gl-sans);color:var(--gl-sub)}
.gl-prevnext b{display:block;font:700 15px var(--gl-head);color:var(--gl-ink);
  margin-top:6px}

/* サイドバー目次：現在位置は色＋左ラインの2要素で示す */
#sidebar .toc{border:1px solid var(--gl-line);border-radius:10px;padding:18px 20px}
#sidebar .toc-title{font:700 14.5px var(--gl-head);color:var(--gl-ink)}
#sidebar .toc a{font:400 13px var(--gl-sans);color:var(--gl-sub);
  text-decoration:none}
#sidebar .toc li.is-active > a{color:var(--gl-teal);font-weight:700;
  border-left:3px solid var(--gl-teal);padding-left:8px;margin-left:-11px}
.gl-side-teacher{border:1px solid #E4E9EC;background:#FAFBFC;border-radius:10px;
  padding:18px 20px}

@media(max-width:900px){
  .gl-lesson-hero{grid-template-columns:1fr;gap:16px}
  .gl-lesson-hero h1{font-size:32px}
  .single .entry-content{font-size:16px}
  .single .entry-content h2{font-size:22px;margin:28px 0 14px}
  .single .entry-content h3{font-size:19px}
  /* A〜Eは潰さず横スクロール */
  .gl-cats{display:flex;overflow-x:auto;gap:10px;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .gl-cat{flex:none;width:150px;scroll-snap-align:start}
  .single .entry-content table{display:block;overflow-x:auto}
  .gl-quiz{flex-direction:column;align-items:stretch;padding:20px 18px}
  .gl-teacher{padding:20px 18px}
  .gl-teacher-row{flex-direction:column;align-items:stretch;gap:14px}
  .gl-teacher-thumb{width:100%;max-width:220px}
  .gl-quiz-btn,.gl-teacher-btn{text-align:center;min-height:44px;
    display:flex;align-items:center;justify-content:center}
  .gl-prevnext{grid-template-columns:1fr 1fr}
  .gl-prevnext > *:nth-child(2){grid-column:1/-1;order:3;
    border-left:0;border-top:1px solid #EDF0F2}
  /* サイドバーの教員向けCTAはスマホで非表示（記事末の1箇所に集約） */
  .gl-side-teacher{display:none}
}


/* サイドバーの2つのカスタムHTML */
.gl-side-nav{border:1px solid var(--gl-line);border-radius:10px;padding:18px 20px}
.gl-side-h{font:700 14.5px var(--gl-head);color:var(--gl-ink);margin:0}
.gl-side-txt{font:400 12.5px/1.75 var(--gl-sans);color:#4A555F;margin:7px 0 0}
.gl-side-btn{display:block;text-align:center;margin-top:14px;
  border:1.5px solid #DBE2E6;border-radius:6px;padding:9px 0;
  font:700 12.5px var(--gl-sans);color:var(--gl-ink)!important;
  text-decoration:none}
.gl-side-link{display:inline-block;margin-top:9px;
  font:700 12.5px var(--gl-sans);color:var(--gl-ink)!important;
  text-decoration:underline;text-underline-offset:3px}