@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.3
*/
/* Avoid a nested card in the sports interpretation sidebar widget. */
body:not(.home):not(.page-id-13) #sidebar #custom_html-40 .aj-smia-sidebar-box { border:0!important; border-radius:0!important; box-shadow:none!important; background:transparent!important; padding:0!important; margin:0!important; }

/* Readable standard headings on Meisei content pages. */
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #main .article h2 { color: #332d2d !important; }

/* Meisei compact content header; TOP and login excluded. */
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header-container{background:#fff!important;border-bottom:1px solid #eadeda;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header-container-in{display:flex!important;align-items:center;justify-content:space-between;gap:24px;max-width:1187px;width:calc(100% - 40px);min-height:76px!important;height:auto!important;margin:0 auto!important;padding:10px 0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header{flex:0 0 auto;width:auto!important;min-height:0!important;height:auto!important;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header-in{width:auto!important;min-height:0!important;height:auto!important;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .tagline{display:none!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header{display:flex!important;align-items:center;gap:12px;width:auto!important;height:auto!important;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header a{display:block!important;margin:0!important;padding:0!important;line-height:1!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header img{display:block!important;width:auto!important;height:48px!important;max-height:48px!important;object-fit:contain;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header::after{content:"明誠高等学校";display:block!important;font-size:20px!important;line-height:1.3!important;white-space:nowrap;letter-spacing:.03em;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi{flex:0 1 auto;width:auto!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi-in{width:auto!important;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc{display:flex!important;flex-wrap:nowrap;gap:4px;align-items:center;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-mobile{display:none!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc>li{width:auto!important;height:auto!important;margin:0!important;padding:0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc>li>a{display:flex!important;align-items:center;justify-content:center;min-height:42px!important;height:auto!important;padding:8px 16px!important;font-size:14px!important;line-height:1.5!important;border-radius:8px;white-space:nowrap;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc>li>a:hover{background:#fff0ec!important;color:#d9534f!important;}
@media(max-width:767px){
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header-container-in{flex-direction:column;gap:6px;width:calc(100% - 24px);padding:10px 0!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header img{width:auto!important;height:36px!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #header .logo-header::after{font-size:18px!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi{width:100%!important;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc{justify-content:center;gap:0;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc>li{flex:1;}
body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418) #navi .menu-pc>li>a{font-size:12px!important;padding:8px 4px!important;}
}


/* Sidebar wrap fix: standard posts/pages only; preserve TOP/login/one-column layouts. */
@media screen and (min-width: 1024px) {
  body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418):not(.column1):not(.no-sidebar) #content-in { flex-wrap: nowrap; gap: 24px; }
  body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418):not(.column1):not(.no-sidebar) #content-in > #main { flex: 1 1 0%; min-width: 0; width: auto; margin-left: 0; margin-right: 0; }
  body:is(.page,.single-post):not(.home):not(.page-id-13):not(.page-id-35418):not(.column1):not(.no-sidebar) #content-in > #sidebar { flex: 0 0 320px; margin-left: 0; margin-right: 0; }
}



/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/************************************
** ■見出しカスタマイズ（h1-6）
************************************/
.article h1,
.article h2,
.article h3,
.article h4,
.article h5,
.article h6{ /*見出し初期化*/
  padding: 0;
  margin: 0;
  font-size: medium;
  border-collapse: separate;
  border-spacing: 0;
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-left: none;
  line-height: normal;
  position:relative;
}

.article h1{ /*見出し１（タイトル）カスタマイズ*/
  background: #e6e6e6; /*背景カラー*/
  font-size: 22px; /*フォントサイズ*/
  letter-spacing: 1px; /*文字間隔*/
  margin: -8px -8px 20px -8px;
  padding: 9px 10px 9px 10px;
  border-left: 10px solid #191970; /*左ラインの太さとカラー*/
  line-height: 35px; /*高さ*/
  border-radius: 3px; /*角丸コーナー*/
  }

.article h2 { /* 見出し2カスタマイズ */
  background: #77A4C6; /* 背景カラー */
  color: #fff; /* 文字色 */
  font-size: 20px;
  letter-spacing: 2px;
  margin: 35px -8px 20px -8px;
  padding: 10px 7px 10px 10px;
  border-left: 7px solid #0075BF;
  border-bottom: 1px solid #0075BF;
  line-height: 35px;
}

.article h3{ /*見出し３カスタマイズ*/
  background: #e6f8ff; /*背景カラー*/
  font-size: 18px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 9px 7px 9px 10px;
  border-left: 5px solid #0075BF; /*左ラインの太さとカラー*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
  line-height: 30px; /*高さ*/
}




.article h4{ /*見出し４カスタマイズ*/
  background: #FFFFFF; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 8px 7px 8px 10px;
  border-left: 2px solid #0075BF; /*左ラインの太さとカラー*/
  line-height: 23px; /*高さ*/
  border-top: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
}

.article h5{ /*見出し５カスタマイズ*/
  background: F3F4F5; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 9px 7px 9px 10px;
  line-height: 20px; /*高さ*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
}

.article h6{ /*見出し６カスタマイズ*/
  background: #F4F5F7; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px 20px 20px 5px;
  padding: 5px 5px 5px 5px;
  border: 1px solid #dcdcdc; /*周囲ラインの太さとカラー*/
  line-height: 27px; /*高さ*/
  text-align: left; /*文字位置*/
  border-radius: 6px; /*角丸コーナー*/
  box-shadow: 3px 3px 2px rgba(0,0,0,0.3); /*シャドー*/
}

add_filter('wpdm_download_count', '__return_empty_string');

/* 講師用カレンダーを前面に出す */
#ea-weekly-calendar-admin { position: relative !important; z-index: 100000 !important; }
#ea-weekly-calendar-admin .fc-header-toolbar { position: relative !important; z-index: 100001 !important; }
#ea-weekly-calendar-admin .fc, 
#ea-weekly-calendar-admin .fc-view-harness { position: relative !important; z-index: 100000 !important; }

/* ボタン類は必ずクリック有効 */
#ea-weekly-calendar-admin .fc-button,
#ea-weekly-calendar-admin .fc-toolbar-chunk * {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* よく被る周辺要素を一段後ろへ（必要十分に弱めの指定） */
#ea-form, .sidebar, #secondary, .widget-area, .site-header, .sticky-header, .top-bar, .announcement-bar {
  position: relative; 
  z-index: 1 !important;
}

/* ===== 講師用ページだけ（page-id-22458）に適用 ===== */
body.page-id-22458 #ea-weekly-calendar-admin,
body.page-id-22458 #ea-weekly-calendar-admin .fc,
body.page-id-22458 #ea-weekly-calendar-admin .fc-header-toolbar {
  position: relative !important;
  z-index: 100000 !important;
}

/* ← この2つが“犯人”。講師用ページではクリック無効化して前にあるカレンダーに通す */
body.page-id-22458 .aioseo-seo-preview-shadow-wrapper {
  pointer-events: none !important;
  /* 影自体も不要なら次の1行も： display:none !important; */
}
body.page-id-22458 #ui-datepicker-div {
  pointer-events: none !important;   /* カレンダーツールバー上での誤被りを防ぐ */
  z-index: 1 !important;             /* 奥へ */
}

/* 念のため：サイドバー等が被るテーマでもカレンダーが前に来るように */
body.page-id-22458 .sidebar,
body.page-id-22458 #secondary,
body.page-id-22458 .widget-area,
body.page-id-22458 .site-header,
body.page-id-22458 .sticky-header,
body.page-id-22458 .top-bar,
body.page-id-22458 .announcement-bar {
  position: relative;
  z-index: 2 !important;
}
/* ── 講師用カレンダーを最前面に ── */
#ea-weekly-calendar-admin,
#ea-weekly-calendar-admin .fc,
#ea-weekly-calendar-admin .fc-header-toolbar {
  position: relative !important;
  z-index: 100000 !important;
}

/* ボタンは必ずクリック可能に */
#ea-weekly-calendar-admin .fc-button,
#ea-weekly-calendar-admin .fc-toolbar-chunk * {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* 代表的な“犯人”を弱める（AIOSEOのプレビュー影 / 非表示のdatepicker） */
.aioseo-seo-preview-shadow-wrapper { pointer-events: none !important; }
#ui-datepicker-div[style*="display: none"] { pointer-events: none !important; }

/* 念のため：サイドバーやヘッダーを一段後ろへ */
.sidebar, #secondary, .widget-area, .site-header, .sticky-header {
  position: relative; z-index: 1 !important;
}

/* プログレスレポートのアコーディオン */
.accordion-header {
  cursor: pointer;
  background: #f3f4f5;
  padding: 10px 15px;
  margin: 5px 0;
  border: 1px solid #ddd;
  font-weight: bold;
  position: relative;
}

.accordion-content {
  display: none;
  padding: 10px 15px;
  border: 1px solid #ddd;
  border-top: none;
}

.accordion-content.open {
  display: block;
}

.accordion-header::after {
  content: "▼"; /* 閉じたときの矢印 */
  position: absolute;
  right: 15px;
  font-size: 0.9em;
  transition: transform 0.3s;
}

.accordion-header.active::after {
  transform: rotate(180deg); /* 開いたとき上向きに */
}

/* staff_user_progress_summary 用の簡易スタイル（講師用/生徒用どちらでも効く） */
.user-summary .progress-title{
  background:#f6f8fa; border:1px solid #ddd; border-radius:8px;
  padding:8px 12px; margin:14px 0 6px; font-weight:600;
}
.user-summary .progress-bar{
  height:12px; background:#e9ecef; border-radius:8px; overflow:hidden;
  margin:4px 0 18px;
}
.user-summary .progress-bar .progress-fill{
  height:100%; background:#4caf50; transition:width .3s ease;
}

/* ===== アコーディオン見出しの色分け ===== */

/* 中学英語（中1〜中3をまとめてピンク） */
.accordion-header.eng-junior {
  background-color: #ffe4ec; /* 薄いピンク */
  color: #333;
}

/* 基礎英語（薄い緑） */
.accordion-header.eng-basic {
  background-color: #e6f5e6; /* 薄いグリーン */
  color: #333;
}

/* 標準英語（基礎より濃い緑） */
.accordion-header.eng-standard {
  background-color: #c2e0c2; /* 少し濃いグリーン */
  color: #333;
}


/* 英語高校イディオム（濃い緑） */
.accordion-header.eng-idiom {
  background-color: #bfc9c4; /* 濃いグリーン */
  color: #333;
}

/* 英語高校必須イディオム模試（緑系の灰色） */ 
.accordion-header.eng-idiomex { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}



/* 基礎数学（薄い水色） */
.accordion-header.math-basic {
  background-color: #e6f5ff; /* 薄い水色 */
  color: #333;
}

/* 標準数学（基礎より濃い水色） */
.accordion-header.math-standard {
  background-color: #cce7f9; /* 濃いめの水色 */
  color: #333;
}

/*ACT（明るい水色） */
.accordion-header.math-act {
  background-color: #d8efff;
  color: #333;
}

/*SAT（やや濃い水色） */
.accordion-header.math-sat {
  background-color: #9fd4ff; /* 既に設定しているSATの水色 */
  color: #000080;  /* ← 濃いめの灰色に変更 */
}

/*Accuplacer（一番濃い青系水色） */
.accordion-header.math-accu {
  background-color: #000080;
  color: #FFFFFF;
}
/*ALEKS（一番濃い青系水色） */
.accordion-header.math-aleks {
  background-color: #008064;
  color: #FFFFFF;
}

/*US History（薄黄色） */
.accordion-header.us-history {
  background-color: #fff2cc;
  color: #5b5b5b;
}

/*US History　教科書視点（薄紫） */
.accordion-header.us-his {
  background-color: #e6e0f8;
  color: #5b5b5b;
}

/*Wold History（） */
.accordion-header.wo-his {
  background-color: #000080;
  color: #FFFFFF;
}

/*biology */
.accordion-header.bio-logy {
  background-color: #e6e0f8;
  color: #5b5b5b;
}

/* Earth Science模試（灰色） */ 
.accordion-header.ear-scien { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}

/* 数学英語表現（灰色） */ 
.accordion-header.eng-read { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}

/*通訳共通問題（明るい水色） */
.accordion-header.interpre-common {
  background-color: #d8efff;
  color: #333;
}

/*通訳サッカー（やや濃い水色） */
.accordion-header.interpre-soccer {
  background-color: #9fd4ff; /* 既に設定しているSATの水色 */
  color: #000080;  /* ← 濃いめの灰色に変更 */
}

/*通訳バスケ（一番濃い青系水色） */
.accordion-header.interpre-basket {
  background-color: #008064;
  color: #FFFFFF;
}

/*通訳野球（一番濃い青系水色） */
.accordion-header.interpre-baseball {
  background-color: #000080;
  color: #FFFFFF;
}

/* .hint の前に出る疑似要素を消す */
.hint::before,
.question::before,
.question::after {
  content: "" !important;
  display: none !important;
}

/* 復習モード全体 */
.review-quiz-test .question {
  background: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 20px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* ヒント部分 */
.review-quiz-test .hint {
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
}

/* 単語ボタン（word-bank） */
.review-quiz-test .word-bank button {
  margin: 4px;
  padding: 6px 10px;
  border: 1px solid #aaa;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
}
.review-quiz-test .word-bank button:hover {
  background: #e6f2ff;
  transform: scale(1.05);
}

/* 並べた答えの表示欄 */
.review-quiz-test .answer-area {
  min-height: 40px;
  margin-top: 8px;
  padding: 6px;
  border: 1px dashed #ccc;
  border-radius: 6px;
  background: #fff;
}

/* 採点結果 */
.review-quiz-test .result {
  margin-top: 10px;
  font-size: 0.95em;
}
.review-quiz-test .result:before {
  content: "▶ ";
  color: #555;
}
.review-quiz-test .result:contains("✅") {
  color: #2c7a2c;
  font-weight: bold;
}
.review-quiz-test .result:contains("❌") {
  color: #c53030;
  font-weight: bold;
}
/* 回答欄の中のボタン */
.review-quiz-test .answer-area button {
  margin: 4px;              /* 単語の間に余白 */
  padding: 6px 10px;
  border: 1px solid #aaa;
  border-radius: 6px;
  background: #fefefe;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
}

/* 並べた答え全体の枠 */
.review-quiz-test .answer-area {
  min-height: 50px;
  margin-top: 8px;
  padding: 8px;
  border: 1px dashed #ccc;
  border-radius: 6px;
  background: #fff;
  display: flex;
  flex-wrap: wrap;          /* 折り返し可能にする */
  gap: 6px;                 /* ボタン同士の隙間 */
}

/* クイズ専用入力欄のリセット */
.char-box {
  all: unset !important;         /* Cocoonの装飾を全部消す */
  display: inline-block !important;
  border-bottom: 2px solid #000 !important;
  width: 1.2em !important;
  height: 1.4em !important;
  text-align: center !important;
  font-family: monospace !important;
  font-size: 0.9rem !important;
  line-height: 1.4em !important;
  margin: 0 2px !important;
  background: transparent !important; /* 黄色背景を打ち消す */
  box-shadow: none !important;        /* 内側の影を消す */
}



/* スポーツ通訳のメニュー */
.smia-layout--topmenu {
  display: block;
}

.smia-topmenu-wrap {
  margin: 0 0 18px;
}

.smia-local-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  padding: 10px 12px;
  background: #f7f8fa;
  border: 1px solid #ddd;
  border-radius: 10px;
  box-sizing: border-box;
}

.smia-local-menu a {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #d6d6d6;
  text-decoration: none;
  color: #333;
  white-space: nowrap;
  font-size: 13px;
  line-height: 1.4;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.smia-local-menu a:hover {
  background: #eef4ff;
  border-color: #b9cdf5;
}

.smia-main {
  min-width: 0;
}

@media (max-width: 767px) {
  .smia-topmenu-wrap {
    margin: 0 0 14px;
  }

  .smia-local-menu {
    gap: 6px 8px;
    padding: 8px 10px;
  }

  .smia-local-menu a {
    padding: 5px 10px;
    font-size: 12px;
  }
}

/* ヘッダー内の文字色を白 */
.header-container,
.header-container * {
  color: #fff !important;
}

/* フッター内の文字色を白 */
.footer,
.footer * {
  color: #fff !important;
}


/**************************************************
 * Meisei School Skin v0.1
 * 2026-09-18
 * Cocoon Child 共通デザイン
 **************************************************/

:root{
  --meisei-red: #df5b57;
  --meisei-red-dark: #c94c49;
  --meisei-red-soft: #fff0ed;
  --meisei-bg: #fffaf8;
  --meisei-card: #ffffff;
  --meisei-text: #332d2d;
  --meisei-muted: #6f6a68;
  --meisei-border: #eadfdb;
  --meisei-blue: #285d8f;
}

/* ==============================
   全体
   ============================== */

body{
  background: var(--meisei-bg);
  color: var(--meisei-text);
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    Meiryo,
    sans-serif;
}

a{
  color: var(--meisei-blue);
  text-decoration: none;
}

a:hover{
  opacity: .78;
}

/* ==============================
   ヘッダー
   ============================== */

#header-container,
.header{
  background: #ffffff !important;
  color: var(--meisei-text) !important;
  border-bottom: 1px solid var(--meisei-border);
}

#header-in{
  padding-top: 18px;
  padding-bottom: 12px;
}

.site-name-text,
.logo-text{
  color: var(--meisei-text) !important;
  font-weight: 700;
}

.site-name-text a,
.logo-text a{
  color: var(--meisei-text) !important;
}

/* ==============================
   グローバルメニュー
   ============================== */

#navi,
.navi{
  background: #ffffff !important;
  border-top: 0;
  border-bottom: 1px solid var(--meisei-border);
}

#navi .navi-in a,
.navi-in a{
  color: var(--meisei-text) !important;
  font-weight: 600;
}

#navi .navi-in a:hover,
.navi-in a:hover{
  background: var(--meisei-red-soft) !important;
  color: var(--meisei-red-dark) !important;
}

/* ==============================
   コンテンツ幅・カード
   ============================== */

#content{
  margin-top: 28px;
}

.main,
.sidebar{
  background: transparent !important;
}

.main{
  border: 0 !important;
}

.article{
  background: var(--meisei-card);
  border: 1px solid var(--meisei-border);
  border-radius: 16px;
  padding: 28px 32px;
  box-shadow: 0 8px 28px rgba(80,50,45,.055);
}

/* ==============================
   タイトル
   ============================== */

.entry-title{
  margin-bottom: 28px;
  padding: 14px 18px !important;
  border: 0 !important;
  border-left: 5px solid var(--meisei-red) !important;
  border-radius: 0 8px 8px 0;
  background: #f8f3f1 !important;
  color: var(--meisei-text);
  font-size: 26px;
  font-weight: 700;
}

.article h2{
  border: 0;
  border-left: 5px solid var(--meisei-red);
  background: #f8f3f1;
  padding: 12px 16px;
}

.article h3{
  border: 0;
  border-bottom: 2px solid var(--meisei-red-soft);
  padding-bottom: 8px;
}

/* ==============================
   サイドバー
   ============================== */

.sidebar .widget{
  background: #ffffff;
  border: 1px solid var(--meisei-border);
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 20px;
  box-shadow: 0 5px 20px rgba(80,50,45,.04);
}

.sidebar .widget-title{
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid var(--meisei-red) !important;
  color: var(--meisei-text) !important;
  padding: 0 0 10px !important;
  margin-bottom: 12px;
  font-size: 18px;
  letter-spacing: .04em;
}

/* ==============================
   フォーム・ログイン
   ============================== */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
select,
textarea{
  background: #ffffff !important;
  border: 1px solid #d9cfcb !important;
  border-radius: 8px !important;
  padding: 11px 13px !important;
  color: var(--meisei-text);
  transition: border-color .15s ease, box-shadow .15s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus{
  border-color: var(--meisei-red) !important;
  box-shadow: 0 0 0 3px rgba(223,91,87,.12) !important;
  outline: none;
}

/* Ultimate Member */
.um input[type="text"],
.um input[type="password"],
.um input[type="email"]{
  border-radius: 8px !important;
}

.um .um-button,
input[type="submit"],
button,
.button,
.btn{
  background: var(--meisei-red) !important;
  border: 0 !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  font-weight: 700;
  padding: 11px 24px !important;
  box-shadow: 0 5px 14px rgba(223,91,87,.18);
  transition: .15s ease;
}

.um .um-button:hover,
input[type="submit"]:hover,
button:hover,
.button:hover,
.btn:hover{
  background: var(--meisei-red-dark) !important;
  transform: translateY(-1px);
}

/* ==============================
   テーブル
   ============================== */

table{
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid var(--meisei-border);
  border-radius: 10px;
}

th{
  background: #f8f3f1 !important;
  color: var(--meisei-text);
}

td,
th{
  border-color: var(--meisei-border) !important;
}

/* ==============================
   講義リンク / カード的な箱
   ============================== */

.article .box,
.article .information-box,
.article .blank-box,
.article .column-wrap{
  border-color: var(--meisei-border);
  border-radius: 12px;
}

/* ==============================
   フッター
   ============================== */

#footer,
.footer{
  background: #f6f2f0 !important;
  color: var(--meisei-muted) !important;
  border-top: 1px solid var(--meisei-border);
}

/* ==============================
   スマホ
   ============================== */

@media screen and (max-width: 834px){

  #content{
    margin-top: 12px;
  }

  .article{
    padding: 20px 16px;
    border-radius: 12px;
  }

  .entry-title{
    font-size: 22px;
    padding: 11px 13px !important;
  }

  .sidebar .widget{
    border-radius: 10px;
  }

  input[type="text"],
  input[type="email"],
  input[type="password"],
  select,
  textarea{
    font-size: 16px !important;
  }
}

/**************************************************
 * Meisei Skin v0.2
 * header / login refinement
 **************************************************/

/* ヘッダーをコンパクト化 */
#header-container,
#header-container-in,
#header,
#header-in{
  min-height: 0 !important;
  height: auto !important;
}

#header-in{
  padding: 18px 20px !important;
}

/* 現在壊れている旧ロゴ画像を一旦非表示 */
.logo-header img,
#logo img{
  display: none !important;
}

/* 仮の明誠タイトルを表示 */
.logo-header::after,
#logo::after{
  content: "明誠高等学校";
  display: block;
  text-align: center;
  color: #332d2d;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.4;
}

/* ヘッダー上下の余白を詰める */
.header-container{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ナビ周辺 */
#navi{
  margin-top: 0 !important;
}

#navi .navi-in > ul{
  justify-content: center;
}

/* メイン領域を少し上へ */
#content{
  margin-top: 22px !important;
}

/* ログインカード */
.article{
  box-shadow: 0 10px 30px rgba(90,55,50,.07);
}

/* ログイン系のフォーム幅 */
.um,
.um-form,
.login-form{
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
}

/* サイドバーのリンク間隔 */
.sidebar .widget li{
  margin: 7px 0;
  line-height: 1.65;
}

/* 管理バー表示時でも見た目を崩しにくく */
.admin-bar #header-container{
  margin-top: 0 !important;
}

/* スマホ */
@media screen and (max-width:834px){

  #header-in{
    padding: 13px 12px !important;
  }

  .logo-header::after,
  #logo::after{
    font-size: 22px;
  }

  #content{
    margin-top: 10px !important;
  }
}

/* 管理者専用エリア */
.aj-admin-only-box {
    background: #eef8ff;
    border: 1px solid #c9e5f7;
    border-left: 5px solid #69b6e5;
    border-radius: 8px;
    padding: 16px 20px;
    margin: 18px 0;
}

/* ================================
   明誠：上部ナビの文字を見やすくする
================================ */

#navi .navi-in > ul > li > a,
#navi .navi-in > ul > li > a:visited,
.navi-in a,
.menu-header a {
    color: #333 !important;
    font-weight: 600;
}

/* マウスを乗せた時 */
#navi .navi-in > ul > li > a:hover,
.navi-in a:hover,
.menu-header a:hover {
    color: #d9534f !important;
    background: #fff3f1 !important;
}

/* 現在のページ */
#navi .current-menu-item > a,
#navi .current-menu-parent > a {
    color: #c94b47 !important;
    background: #fff0ed !important;
}
#navi a {
    color: #333 !important;
}

/* 明誠：グローバルナビ文字色を強制 */
body #navi .navi-in ul li a,
body #navi .navi-in ul li a:visited,
body #navi .navi-in ul li a .item-label,
body #navi .navi-in ul li a span {
    color: #333333 !important;
}

/* hover */
body #navi .navi-in ul li a:hover,
body #navi .navi-in ul li a:hover .item-label,
body #navi .navi-in ul li a:hover span {
    color: #c94b47 !important;
}

/* =========================================================
   明誠 LMS - ログイン / ダッシュボード画面
   ========================================================= */

/* 全体背景 */
body {
    background: #fffaf8;
}

/* -------------------------
   ヘッダー
------------------------- */

#header-container {
    background: #ffffff;
    box-shadow: none;
    border-bottom: 1px solid #f0dfdb;
}

#header-container .header {
    min-height: auto !important;
    padding: 18px 0 14px !important;
}

#header-container .logo {
    margin: 0 !important;
}

#header-container .logo-text {
    font-size: 28px !important;
    font-weight: 700;
    line-height: 1.3;
}

/* ナビ */
#navi {
    background: #ffffff !important;
    border-top: 1px solid #f4e7e3;
    border-bottom: 1px solid #eadbd7;
}

#navi .navi-in > ul {
    justify-content: center;
}

#navi .navi-in > ul > li > a {
    min-height: 58px !important;
    padding: 0 26px !important;
    color: #222 !important;
    font-weight: 600;
    font-size: 15px;
}

#navi .navi-in > ul > li > a .item-label,
#navi .navi-in > ul > li > a span {
    color: #222 !important;
}

#navi .navi-in > ul > li > a:hover {
    background: #fff2ef !important;
    color: #d9504d !important;
}

/* -------------------------
   コンテンツ全体
------------------------- */

#content {
    max-width: 1180px !important;
    margin: 46px auto 60px !important;
    padding: 0 20px !important;
}

.content-in {
    gap: 24px;
}

.main {
    background: #ffffff !important;
    border: 1px solid #eadeda;
    border-radius: 18px;
    box-shadow: 0 8px 30px rgba(70, 40, 30, 0.05);
    padding: 26px 34px 38px !important;
}

/* -------------------------
   「ログイン」の見出し
------------------------- */

.entry-title {
    background: #faf6f4 !important;
    border: 0 !important;
    border-left: 5px solid #e85c58 !important;
    border-radius: 4px;
    padding: 17px 20px !important;
    margin: 0 0 34px !important;
    font-size: 22px !important;
    font-weight: 700;
}

/* ログイン済みなら「ログイン」見出しは消す */
.logged-in .entry-title {
    display: none;
}

/* ログイン済み時の余計な上部空白も削る */
.logged-in .entry-content {
    margin-top: 0 !important;
}

/* -------------------------
   Welcome
------------------------- */

.meisei-welcome {
    max-width: none !important;
    margin: 8px 0 30px !important;
    padding: 0 !important;
}

.meisei-eyebrow {
    color: #e85753;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    margin-bottom: 12px;
}

.meisei-welcome h1 {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 10px !important;
    font-size: 34px !important;
    line-height: 1.35;
    font-weight: 500;
}

.meisei-welcome h1 span {
    color: #e85753 !important;
}

.meisei-welcome p {
    margin: 0 !important;
    color: #666;
    font-size: 14px;
}

/* -------------------------
   Ultimate Member 部分
------------------------- */

.um {
    max-width: 640px !important;
    margin: 28px auto 0 !important;
}

.um-profile-photo {
    margin-top: 10px !important;
}

/* -------------------------
   サイドバー
------------------------- */

.sidebar {
    width: 320px !important;
}

.sidebar .widget {
    background: #ffffff;
    border: 1px solid #eadeda;
    border-radius: 16px;
    padding: 18px 20px !important;
    margin-bottom: 16px !important;
    box-shadow: none;
}

.sidebar .widget-title {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid #e85c58 !important;
    padding: 0 0 10px !important;
    margin: 0 0 12px !important;
    font-size: 19px;
}

.sidebar ul {
    margin: 0;
}

.sidebar li {
    margin: 0;
    padding: 8px 2px;
}

.sidebar a {
    color: #222;
    text-decoration: none;
}

.sidebar a:hover {
    color: #e85753;
}

/* -------------------------
   モバイル
------------------------- */

@media screen and (max-width: 834px) {

    #content {
        margin-top: 24px !important;
        padding: 0 12px !important;
    }

    .main {
        padding: 20px !important;
        border-radius: 12px;
    }

    .meisei-welcome h1 {
        font-size: 27px !important;
    }

    .sidebar {
        width: 100% !important;
    }
}
/* 明誠 TOP ロゴ */
/* 明誠 × Penn Foster */
.meisei-top-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 18px auto 34px;
    padding: 12px 0;
}

.meisei-top-brand img {
    display: block;
    width: auto;
    height: auto;
    object-fit: contain;
}

.meisei-top-brand .meisei-logo {
    max-width: 310px;
    max-height: 82px;
}

.meisei-top-brand .pf-logo {
    max-width: 170px;
    max-height: 65px;
}

.meisei-brand-x {
    color: #b9aaa6;
    font-size: 22px;
    font-weight: 400;
}

/* スマホ */
@media screen and (max-width: 600px) {
    .meisei-top-brand {
        gap: 10px;
        margin-bottom: 24px;
    }

    .meisei-top-brand .meisei-logo {
        max-width: 210px;
        max-height: 60px;
    }

    .meisei-top-brand .pf-logo {
        max-width: 110px;
        max-height: 48px;
    }

    .meisei-brand-x {
        font-size: 17px;
    }
}
<div class="meisei-dashboard">

[meisei_welcome]

<div class="meisei-pf-card">
  <div class="meisei-pf-card-left">
    <div class="meisei-pf-logo-box">
      <img src="https://meisei.pf-japan.org/wp-content/uploads/2026/09/PFlogo.png" alt="Penn Foster">
    </div>

    <div>
      <div class="meisei-card-kicker">PENN FOSTER HIGH SCHOOL</div>
      <div class="meisei-card-title">米国高校の授業を履修する</div>
      <div class="meisei-card-desc">
        履修・課題提出・成績確認はPenn Foster High Schoolの学習サイトで行います。
      </div>
    </div>
  </div>

  <a class="meisei-red-button" href="#">
    Penn Fosterへログイン →
  </a>
</div>


<div class="meisei-section-heading">
  <span>AJ SUPPORT PORTAL</span>
  <strong>AJサポートサイト</strong>
  <small>すべての教材をいつでも利用できます。</small>
</div>


<div class="meisei-support-grid">

  <div class="meisei-support-main">

    <h2>▶ はじめての方はこちら</h2>

    <div class="meisei-support-main-inner">

      <div class="meisei-video-placeholder">
        <div>WELCOME TO PENN FOSTER</div>
        <div class="meisei-video-play">▶</div>
      </div>

      <div class="meisei-support-copy">
        <div class="meisei-small-red">
          Penn Fosterのログイン情報を受け取った方へ
        </div>

        <h3>Welcome to Penn Foster</h3>

        <p>
          まずこの動画を見て、これからの学び方と
          AJサポートサイトの使い方を確認しましょう。
        </p>

        <a class="meisei-red-button" href="#">
          次のオリエンテーションへ →
        </a>
      </div>

    </div>
  </div>


  <div class="meisei-support-side">

    <h2>✧ 学び方は自由です</h2>

    <div class="meisei-step">
      <span>1</span>
      <div>
        <strong>Penn Fosterの日本語解説</strong>
        <small>授業で困った時に聞く</small>
      </div>
    </div>

    <div class="meisei-step">
      <span>2</span>
      <div>
        <strong>科目別セルフチェック</strong>
        <small>理解度を確かめたい時に受ける</small>
      </div>
    </div>

    <div class="meisei-step">
      <span>3</span>
      <div>
        <strong>英語・数学の基礎</strong>
        <small>学び直したい時に開く</small>
      </div>
    </div>

    <a class="meisei-text-link" href="#">
      すべての教材を見る →
    </a>

  </div>

</div>


<div class="meisei-orientation">

  <div class="meisei-orientation-copy">
    <div class="meisei-card-kicker">
      STEP 2 · PENN FOSTER ORIENTATION
    </div>

    <span class="meisei-tag">
      Welcome動画を見た後に進みましょう
    </span>

    <h2>Orientation Penn Foster High School</h2>
  </div>

  <div class="meisei-orientation-video">
    Orientation
  </div>

</div>

</div>

/* ==========================================================
   MEISEI TOP v2
   元Manusダッシュボード再現用
========================================================== */

#meisei-dashboard-v2 {
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 0 20px 60px !important;
    font-family: inherit;
    color: #282323;
}


/* ---------- Welcome ---------- */

#meisei-dashboard-v2 .ms-welcome {
    margin: 0 0 26px !important;
}

#meisei-dashboard-v2 .ms-welcome .meisei-welcome {
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
}

#meisei-dashboard-v2 .ms-welcome .meisei-eyebrow {
    display: none !important;
}

#meisei-dashboard-v2 .ms-welcome h1 {
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 7px 0 8px !important;

    font-size: 36px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
}

#meisei-dashboard-v2 .ms-welcome h1 span {
    color: #e65b55 !important;
}

#meisei-dashboard-v2 .ms-welcome p {
    margin: 0 !important;
    color: #6d6663 !important;
    font-size: 14px !important;
}


/* ---------- 共通 ---------- */

#meisei-dashboard-v2 .ms-kicker {
    color: #e65b55 !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    letter-spacing: .07em !important;
}


/* ---------- Penn Fosterカード ---------- */

#meisei-dashboard-v2 .ms-pf-card {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    box-sizing: border-box !important;

    margin: 0 0 32px !important;
    padding: 20px 22px !important;

    background: #fffdfc !important;
    border: 1px solid #efd8d2 !important;
    border-radius: 16px !important;
    box-shadow: none !important;
}

#meisei-dashboard-v2 .ms-pf-left {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
}

#meisei-dashboard-v2 .ms-pf-logo {
    width: 96px !important;
    min-width: 96px !important;
    height: 62px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #fff !important;
    border: 1px solid #efd3cc !important;
    border-radius: 11px !important;
}

#meisei-dashboard-v2 .ms-pf-logo img {
    width: 78px !important;
    max-width: 78px !important;
    height: auto !important;
    max-height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
}

#meisei-dashboard-v2 .ms-pf-copy h2 {
    margin: 3px 0 4px !important;
    padding: 0 !important;

    background: none !important;
    border: 0 !important;

    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

#meisei-dashboard-v2 .ms-pf-copy p {
    margin: 0 !important;
    color: #766c69 !important;
    font-size: 12px !important;
}


/* ---------- ボタン ---------- */

#meisei-dashboard-v2 .ms-button {
    display: inline-block !important;
    flex-shrink: 0 !important;

    padding: 13px 21px !important;

    background: #e65b55 !important;
    color: #fff !important;

    border: 0 !important;
    border-radius: 9px !important;

    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 700 !important;

    box-shadow: 0 7px 15px rgba(210, 80, 70, .15) !important;
}

#meisei-dashboard-v2 .ms-button:hover {
    background: #d94f49 !important;
}


/* ---------- AJ SUPPORT見出し ---------- */

#meisei-dashboard-v2 .ms-section-title {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;

    margin: 0 0 12px !important;
}

#meisei-dashboard-v2 .ms-section-title span {
    color: #e65b55 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
}

#meisei-dashboard-v2 .ms-section-title strong {
    font-size: 18px !important;
}

#meisei-dashboard-v2 .ms-section-title small {
    color: #8b817e !important;
    font-size: 11px !important;
}


/* ---------- 2カラム ---------- */

#meisei-dashboard-v2 .ms-support-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 2.15fr) minmax(270px, .9fr) !important;
    gap: 18px !important;
}


/* ---------- 左カード ---------- */

#meisei-dashboard-v2 .ms-support-main {
    padding: 21px !important;

    background: #fff !important;
    border: 1px solid #e3dfdd !important;
    border-radius: 16px !important;
}

#meisei-dashboard-v2 .ms-support-main > h2,
#meisei-dashboard-v2 .ms-learning-card > h2 {
    margin: 0 0 17px !important;
    padding: 0 !important;

    background: none !important;
    border: 0 !important;

    color: #282323 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}

#meisei-dashboard-v2 .ms-support-inner {
    display: grid !important;
    grid-template-columns: 1.05fr 1.3fr !important;
    gap: 22px !important;
    align-items: center !important;
}


/* ---------- 動画 ---------- */

#meisei-dashboard-v2 .ms-video {
    position: relative !important;

    width: 100% !important;
    aspect-ratio: 16 / 9 !important;

    box-sizing: border-box !important;
    padding: 13px !important;

    background: #05090d !important;
    color: #fff !important;

    border-radius: 10px !important;
    overflow: hidden !important;

    font-size: 11px !important;
}

#meisei-dashboard-v2 .ms-video span {
    position: absolute !important;
    left: 18px !important;
    bottom: 15px !important;
    font-size: 20px !important;
}


/* ---------- 動画右 ---------- */

#meisei-dashboard-v2 .ms-support-text h3 {
    margin: 5px 0 9px !important;
    padding: 0 !important;

    background: none !important;
    border: 0 !important;

    font-size: 18px !important;
}

#meisei-dashboard-v2 .ms-support-text p {
    margin: 0 0 16px !important;
    color: #756c69 !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
}


/* ---------- 右カード ---------- */

#meisei-dashboard-v2 .ms-learning-card {
    padding: 21px !important;

    background: #fff !important;
    border: 1px solid #e3dfdd !important;
    border-radius: 16px !important;
}

#meisei-dashboard-v2 .ms-learning-row {
    display: flex !important;
    gap: 11px !important;
    margin-bottom: 15px !important;
}

#meisei-dashboard-v2 .ms-learning-row > b {
    width: 23px !important;
    min-width: 23px !important;
    height: 23px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #fff0ed !important;
    color: #e65b55 !important;

    border-radius: 50% !important;

    font-size: 10px !important;
}

#meisei-dashboard-v2 .ms-learning-row strong {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

#meisei-dashboard-v2 .ms-learning-row small {
    display: block !important;
    margin-top: 2px !important;

    color: #8b817e !important;
    font-size: 10px !important;
}

#meisei-dashboard-v2 .ms-more {
    color: #e65b55 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}


/* ---------- Cocoon側をTOPだけ抑制 ---------- */

body:has(#meisei-dashboard-v2) {
    background: #fffaf7 !important;
}

body:has(#meisei-dashboard-v2) #sidebar {
    display: none !important;
}

body:has(#meisei-dashboard-v2) .main {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body:has(#meisei-dashboard-v2) #content {
    max-width: 1180px !important;
    margin: 32px auto 60px !important;
    padding: 0 !important;
}

body:has(#meisei-dashboard-v2) .entry-header,
body:has(#meisei-dashboard-v2) .entry-title {
    display: none !important;
}

body:has(#meisei-dashboard-v2) .entry-content {
    margin: 0 !important;
}


/* ---------- スマホ ---------- */

@media screen and (max-width: 800px) {

    #meisei-dashboard-v2 {
        padding: 0 14px 40px !important;
    }

    #meisei-dashboard-v2 .ms-welcome h1 {
        font-size: 27px !important;
    }

    #me
	
	
/* =========================================================
   明誠TOP：アカウント情報を右上へ強制移動
========================================================= */

body:has(#meisei-dashboard-v2) .article {
    position: relative !important;
}

/* Ultimate Member 全体を右上へ */
body:has(#meisei-dashboard-v2) .um {
    position: absolute !important;
    top: 28px !important;
    right: 28px !important;

    width: 220px !important;
    max-width: 220px !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 10px 12px !important;

    background: #ffffff !important;
    border: 1px solid #eadeda !important;
    border-radius: 12px !important;
    box-shadow: none !important;

    z-index: 50 !important;
}

/* UM内部の巨大余白を消す */
body:has(#meisei-dashboard-v2) .um *,
body:has(#meisei-dashboard-v2) .um-profile,
body:has(#meisei-dashboard-v2) .um-header,
body:has(#meisei-dashboard-v2) .um-profile-body,
body:has(#meisei-dashboard-v2) .um-account {
    min-height: 0 !important;
}

/* アバター */
body:has(#meisei-dashboard-v2) .um img {
    max-width: 38px !important;
    max-height: 38px !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
}

/* 名前 */
body:has(#meisei-dashboard-v2) .um-name,
body:has(#meisei-dashboard-v2) .um-name a {
    font-size: 12px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

/* リンク */
body:has(#meisei-dashboard-v2) .um a {
    font-size: 11px !important;
    line-height: 1.5 !important;
}

/* 横線や余白を縮小 */
body:has(#meisei-dashboard-v2) .um hr {
    margin: 5px 0 !important;
}

/* Welcome右側をアカウント分だけ空ける */
body:has(#meisei-dashboard-v2) .ms-welcome {
    padding-right: 260px !important;
    min-height: 100px !important;
}

/* スマホ */
@media screen and (max-width: 800px) {

    body:has(#meisei-dashboard-v2) .um {
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 0 15px !important;
    }

    body:has(#meisei-dashboard-v2) .ms-welcome {
        padding-right: 0 !important;
    }
}
	/* =========================================
   明誠TOP 小型アカウント
========================================= */

#meisei-dashboard-v2 {
    position: relative !important;
}

/* 今まで中央に出ていたUltimate MemberプロフィールをTOPだけ消す */
body:has(#meisei-dashboard-v2) .um {
    display: none !important;
}

/* 右上の小型アカウント */
#meisei-dashboard-v2 .ms-account-chip {
    position: absolute;
    top: 0;
    right: 0;

    display: flex;
    align-items: center;
    gap: 9px;

    padding: 8px 12px;

    background: #fff;
    border: 1px solid #eadeda;
    border-radius: 12px;

    font-size: 11px;
    line-height: 1.35;

    z-index: 20;
}

#meisei-dashboard-v2 .ms-account-icon {
    width: 34px;
    height: 34px;
}

#meisei-dashboard-v2 .ms-account-icon img {
    display: block;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50%;
    margin: 0 !important;
}

#meisei-dashboard-v2 .ms-account-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#meisei-dashboard-v2 .ms-account-info strong {
    font-size: 12px;
    white-space: nowrap;
}

#meisei-dashboard-v2 .ms-account-info a {
    color: #e65b55 !important;
    font-size: 10px;
    text-decoration: none;
}

/* 右上アカウントとWelcomeが重ならないように */
#meisei-dashboard-v2 .ms-welcome {
    padding-right: 210px !important;
}


/* スマホ */
@media screen and (max-width: 700px) {

    #meisei-dashboard-v2 .ms-account-chip {
        position: static;
        width: fit-content;
        margin: 0 0 18px auto;
    }

    #meisei-dashboard-v2 .ms-welcome {
        padding-right: 0 !important;
    }
}
	/* =========================================================
   明誠TOP 最終調整
========================================================= */

#meisei-dashboard-v2 {
    position: relative !important;
    padding-top: 8px !important;
}


/* -----------------------------------------
   アカウントを右上へ
----------------------------------------- */

#meisei-dashboard-v2 .ms-account-chip {
    position: absolute !important;

    top: 4px !important;
    right: 6px !important;
    left: auto !important;

    display: flex !important;
    align-items: center !important;
    gap: 9px !important;

    width: auto !important;
    max-width: 210px !important;

    margin: 0 !important;
    padding: 7px 10px !important;

    background: #ffffff !important;
    border: 1px solid #eadeda !important;
    border-radius: 12px !important;

    box-shadow: none !important;

    z-index: 30 !important;
}


/* アバター */
#meisei-dashboard-v2 .ms-account-icon {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
}

#meisei-dashboard-v2 .ms-account-icon img {
    display: block !important;

    width: 32px !important;
    height: 32px !important;

    margin: 0 !important;

    border-radius: 50% !important;
}


/* 名前＋ログアウト */
#meisei-dashboard-v2 .ms-account-info {
    display: flex !important;
    flex-direction: column !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1.3 !important;
}

#meisei-dashboard-v2 .ms-account-info strong {
    color: #332d2d !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    white-space: nowrap !important;
}

#meisei-dashboard-v2 .ms-account-info a {
    margin-top: 2px !important;

    color: #df5b57 !important;

    font-size: 10px !important;
    text-decoration: none !important;
}


/* -----------------------------------------
   Welcome
----------------------------------------- */

/* 右上アカウントと重ならないようにする */
#meisei-dashboard-v2 .ms-welcome {
    padding-right: 230px !important;
    margin-bottom: 26px !important;
}

/* kicker二重表示防止 */
#meisei-dashboard-v2 .ms-welcome .meisei-eyebrow {
    display: none !important;
}


/* -----------------------------------------
   Penn Fosterカードの文字色修正
----------------------------------------- */

#meisei-dashboard-v2 .ms-pf-copy h2 {
    color: #2d2928 !important;

    margin: 4px 0 5px !important;
    padding: 0 !important;

    background: none !important;
    border: 0 !important;

    font-size: 19px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
}

#meisei-dashboard-v2 .ms-pf-copy p {
    color: #6f6663 !important;
}


/* Support側の見出しも白文字化を防ぐ */
#meisei-dashboard-v2 .ms-support-main h2,
#meisei-dashboard-v2 .ms-learning-card h2,
#meisei-dashboard-v2 .ms-support-text h3 {
    color: #292525 !important;
}


/* -----------------------------------------
   スマホ
----------------------------------------- */

@media screen and (max-width: 800px) {

    #meisei-dashboard-v2 .ms-account-chip {
        position: static !important;

        width: fit-content !important;
        max-width: none !important;

        margin: 0 0 15px auto !important;
    }

    #meisei-dashboard-v2 .ms-welcome {
        padding-right: 0 !important;
    }
}
	
/* =================================================
   明誠TOP：タイトルだけ消してメニューは必ず残す
================================================= */

/* メニューを含む外枠は必ず表示 */
body:has(#meisei-dashboard-v2) #header-container,
body:has(#meisei-dashboard-v2) .header-container,
body:has(#meisei-dashboard-v2) #header-container-in,
body:has(#meisei-dashboard-v2) .header-container-in {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
}

/* 「明誠高等学校」のタイトル部分だけ消す */
body:has(#meisei-dashboard-v2) #header,
body:has(#meisei-dashboard-v2) .header {
    display: none !important;
}

/* ナビメニューは必ず表示 */
body:has(#meisei-dashboard-v2) #navi,
body:has(#meisei-dashboard-v2) .navi {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* メニュー文字 */
body:has(#meisei-dashboard-v2) #navi .navi-in > ul {
    display: flex !important;
    justify-content: center !important;
}

body:has(#meisei-dashboard-v2) #navi .navi-in > ul > li > a {
    color: #222 !important;
    min-height: 50px !important;
    padding: 0 22px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
	
	明誠高等学校ロゴ  ×  PENN FOSTER

ホーム　学ぶ　テスト・模擬試験　学習結果　サポート...

────────────────────

おかえりなさい……@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.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/************************************
** ■見出しカスタマイズ（h1-6）
************************************/
.article h1,
.article h2,
.article h3,
.article h4,
.article h5,
.article h6{ /*見出し初期化*/
  padding: 0;
  margin: 0;
  font-size: medium;
  border-collapse: separate;
  border-spacing: 0;
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-left: none;
  line-height: normal;
  position:relative;
}

.article h1{ /*見出し１（タイトル）カスタマイズ*/
  background: #e6e6e6; /*背景カラー*/
  font-size: 22px; /*フォントサイズ*/
  letter-spacing: 1px; /*文字間隔*/
  margin: -8px -8px 20px -8px;
  padding: 9px 10px 9px 10px;
  border-left: 10px solid #191970; /*左ラインの太さとカラー*/
  line-height: 35px; /*高さ*/
  border-radius: 3px; /*角丸コーナー*/
  }

.article h2 { /* 見出し2カスタマイズ */
  background: #77A4C6; /* 背景カラー */
  color: #fff; /* 文字色 */
  font-size: 20px;
  letter-spacing: 2px;
  margin: 35px -8px 20px -8px;
  padding: 10px 7px 10px 10px;
  border-left: 7px solid #0075BF;
  border-bottom: 1px solid #0075BF;
  line-height: 35px;
}

.article h3{ /*見出し３カスタマイズ*/
  background: #e6f8ff; /*背景カラー*/
  font-size: 18px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 9px 7px 9px 10px;
  border-left: 5px solid #0075BF; /*左ラインの太さとカラー*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
  line-height: 30px; /*高さ*/
}




.article h4{ /*見出し４カスタマイズ*/
  background: #FFFFFF; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 8px 7px 8px 10px;
  border-left: 2px solid #0075BF; /*左ラインの太さとカラー*/
  line-height: 23px; /*高さ*/
  border-top: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
}

.article h5{ /*見出し５カスタマイズ*/
  background: F3F4F5; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px -8px 20px -8px;
  padding: 9px 7px 9px 10px;
  line-height: 20px; /*高さ*/
  border-bottom: 1px solid #0075BF; /*アンダーラインの太さとカラー*/
}

.article h6{ /*見出し６カスタマイズ*/
  background: #F4F5F7; /*背景カラー*/
  font-size: 16px; /*フォントサイズ*/
  letter-spacing: 2px; /*文字間隔*/
  margin: 35px 20px 20px 5px;
  padding: 5px 5px 5px 5px;
  border: 1px solid #dcdcdc; /*周囲ラインの太さとカラー*/
  line-height: 27px; /*高さ*/
  text-align: left; /*文字位置*/
  border-radius: 6px; /*角丸コーナー*/
  box-shadow: 3px 3px 2px rgba(0,0,0,0.3); /*シャドー*/
}


/* 講師用カレンダーを前面に出す */
#ea-weekly-calendar-admin { position: relative !important; z-index: 100000 !important; }
#ea-weekly-calendar-admin .fc-header-toolbar { position: relative !important; z-index: 100001 !important; }
#ea-weekly-calendar-admin .fc, 
#ea-weekly-calendar-admin .fc-view-harness { position: relative !important; z-index: 100000 !important; }

/* ボタン類は必ずクリック有効 */
#ea-weekly-calendar-admin .fc-button,
#ea-weekly-calendar-admin .fc-toolbar-chunk * {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* よく被る周辺要素を一段後ろへ（必要十分に弱めの指定） */
#ea-form, .sidebar, #secondary, .widget-area, .site-header, .sticky-header, .top-bar, .announcement-bar {
  position: relative; 
  z-index: 1 !important;
}

/* ===== 講師用ページだけ（page-id-22458）に適用 ===== */
body.page-id-22458 #ea-weekly-calendar-admin,
body.page-id-22458 #ea-weekly-calendar-admin .fc,
body.page-id-22458 #ea-weekly-calendar-admin .fc-header-toolbar {
  position: relative !important;
  z-index: 100000 !important;
}

/* ← この2つが“犯人”。講師用ページではクリック無効化して前にあるカレンダーに通す */
body.page-id-22458 .aioseo-seo-preview-shadow-wrapper {
  pointer-events: none !important;
  /* 影自体も不要なら次の1行も： display:none !important; */
}
body.page-id-22458 #ui-datepicker-div {
  pointer-events: none !important;   /* カレンダーツールバー上での誤被りを防ぐ */
  z-index: 1 !important;             /* 奥へ */
}

/* 念のため：サイドバー等が被るテーマでもカレンダーが前に来るように */
body.page-id-22458 .sidebar,
body.page-id-22458 #secondary,
body.page-id-22458 .widget-area,
body.page-id-22458 .site-header,
body.page-id-22458 .sticky-header,
body.page-id-22458 .top-bar,
body.page-id-22458 .announcement-bar {
  position: relative;
  z-index: 2 !important;
}
/* ── 講師用カレンダーを最前面に ── */
#ea-weekly-calendar-admin,
#ea-weekly-calendar-admin .fc,
#ea-weekly-calendar-admin .fc-header-toolbar {
  position: relative !important;
  z-index: 100000 !important;
}

/* ボタンは必ずクリック可能に */
#ea-weekly-calendar-admin .fc-button,
#ea-weekly-calendar-admin .fc-toolbar-chunk * {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* 代表的な“犯人”を弱める（AIOSEOのプレビュー影 / 非表示のdatepicker） */
.aioseo-seo-preview-shadow-wrapper { pointer-events: none !important; }
#ui-datepicker-div[style*="display: none"] { pointer-events: none !important; }

/* 念のため：サイドバーやヘッダーを一段後ろへ */
.sidebar, #secondary, .widget-area, .site-header, .sticky-header {
  position: relative; z-index: 1 !important;
}

/* プログレスレポートのアコーディオン */
.accordion-header {
  cursor: pointer;
  background: #f3f4f5;
  padding: 10px 15px;
  margin: 5px 0;
  border: 1px solid #ddd;
  font-weight: bold;
  position: relative;
}

.accordion-content {
  display: none;
  padding: 10px 15px;
  border: 1px solid #ddd;
  border-top: none;
}

.accordion-content.open {
  display: block;
}

.accordion-header::after {
  content: "▼"; /* 閉じたときの矢印 */
  position: absolute;
  right: 15px;
  font-size: 0.9em;
  transition: transform 0.3s;
}

.accordion-header.active::after {
  transform: rotate(180deg); /* 開いたとき上向きに */
}

/* staff_user_progress_summary 用の簡易スタイル（講師用/生徒用どちらでも効く） */
.user-summary .progress-title{
  background:#f6f8fa; border:1px solid #ddd; border-radius:8px;
  padding:8px 12px; margin:14px 0 6px; font-weight:600;
}
.user-summary .progress-bar{
  height:12px; background:#e9ecef; border-radius:8px; overflow:hidden;
  margin:4px 0 18px;
}
.user-summary .progress-bar .progress-fill{
  height:100%; background:#4caf50; transition:width .3s ease;
}

/* ===== アコーディオン見出しの色分け ===== */

/* 中学英語（中1〜中3をまとめてピンク） */
.accordion-header.eng-junior {
  background-color: #ffe4ec; /* 薄いピンク */
  color: #333;
}

/* 基礎英語（薄い緑） */
.accordion-header.eng-basic {
  background-color: #e6f5e6; /* 薄いグリーン */
  color: #333;
}

/* 標準英語（基礎より濃い緑） */
.accordion-header.eng-standard {
  background-color: #c2e0c2; /* 少し濃いグリーン */
  color: #333;
}


/* 英語高校イディオム（濃い緑） */
.accordion-header.eng-idiom {
  background-color: #bfc9c4; /* 濃いグリーン */
  color: #333;
}

/* 英語高校必須イディオム模試（緑系の灰色） */ 
.accordion-header.eng-idiomex { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}



/* 基礎数学（薄い水色） */
.accordion-header.math-basic {
  background-color: #e6f5ff; /* 薄い水色 */
  color: #333;
}

/* 標準数学（基礎より濃い水色） */
.accordion-header.math-standard {
  background-color: #cce7f9; /* 濃いめの水色 */
  color: #333;
}

/*ACT（明るい水色） */
.accordion-header.math-act {
  background-color: #d8efff;
  color: #333;
}

/*SAT（やや濃い水色） */
.accordion-header.math-sat {
  background-color: #9fd4ff; /* 既に設定しているSATの水色 */
  color: #000080;  /* ← 濃いめの灰色に変更 */
}

/*Accuplacer（一番濃い青系水色） */
.accordion-header.math-accu {
  background-color: #000080;
  color: #FFFFFF;
}
/*ALEKS（一番濃い青系水色） */
.accordion-header.math-aleks {
  background-color: #008064;
  color: #FFFFFF;
}

/*US History（薄黄色） */
.accordion-header.us-history {
  background-color: #fff2cc;
  color: #5b5b5b;
}

/*US History　教科書視点（薄紫） */
.accordion-header.us-his {
  background-color: #e6e0f8;
  color: #5b5b5b;
}

/*Wold History（） */
.accordion-header.wo-his {
  background-color: #000080;
  color: #FFFFFF;
}

/*biology */
.accordion-header.bio-logy {
  background-color: #e6e0f8;
  color: #5b5b5b;
}

/* Earth Science模試（灰色） */ 
.accordion-header.ear-scien { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}

/* 数学英語表現（灰色） */ 
.accordion-header.eng-read { 
  background-color: #ebedec; /* 緑系の灰色 */ 
  color: #333;
}

/*通訳共通問題（明るい水色） */
.accordion-header.interpre-common {
  background-color: #d8efff;
  color: #333;
}

/*通訳サッカー（やや濃い水色） */
.accordion-header.interpre-soccer {
  background-color: #9fd4ff; /* 既に設定しているSATの水色 */
  color: #000080;  /* ← 濃いめの灰色に変更 */
}

/*通訳バスケ（一番濃い青系水色） */
.accordion-header.interpre-basket {
  background-color: #008064;
  color: #FFFFFF;
}

/*通訳野球（一番濃い青系水色） */
.accordion-header.interpre-baseball {
  background-color: #000080;
  color: #FFFFFF;
}

/* .hint の前に出る疑似要素を消す */
.hint::before,
.question::before,
.question::after {
  content: "" !important;
  display: none !important;
}

/* 復習モード全体 */
.review-quiz-test .question {
  background: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 20px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* ヒント部分 */
.review-quiz-test .hint {
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
}

/* 単語ボタン（word-bank） */
.review-quiz-test .word-bank button {
  margin: 4px;
  padding: 6px 10px;
  border: 1px solid #aaa;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
}
.review-quiz-test .word-bank button:hover {
  background: #e6f2ff;
  transform: scale(1.05);
}

/* 並べた答えの表示欄 */
.review-quiz-test .answer-area {
  min-height: 40px;
  margin-top: 8px;
  padding: 6px;
  border: 1px dashed #ccc;
  border-radius: 6px;
  background: #fff;
}

/* 採点結果 */
.review-quiz-test .result {
  margin-top: 10px;
  font-size: 0.95em;
}
.review-quiz-test .result:before {
  content: "▶ ";
  color: #555;
}
.review-quiz-test .result:contains("✅") {
  color: #2c7a2c;
  font-weight: bold;
}
.review-quiz-test .result:contains("❌") {
  color: #c53030;
  font-weight: bold;
}
/* 回答欄の中のボタン */
.review-quiz-test .answer-area button {
  margin: 4px;              /* 単語の間に余白 */
  padding: 6px 10px;
  border: 1px solid #aaa;
  border-radius: 6px;
  background: #fefefe;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
}

/* 並べた答え全体の枠 */
.review-quiz-test .answer-area {
  min-height: 50px;
  margin-top: 8px;
  padding: 8px;
  border: 1px dashed #ccc;
  border-radius: 6px;
  background: #fff;
  display: flex;
  flex-wrap: wrap;          /* 折り返し可能にする */
  gap: 6px;                 /* ボタン同士の隙間 */
}

/* クイズ専用入力欄のリセット */
.char-box {
  all: unset !important;         /* Cocoonの装飾を全部消す */
  display: inline-block !important;
  border-bottom: 2px solid #000 !important;
  width: 1.2em !important;
  height: 1.4em !important;
  text-align: center !important;
  font-family: monospace !important;
  font-size: 0.9rem !important;
  line-height: 1.4em !important;
  margin: 0 2px !important;
  background: transparent !important; /* 黄色背景を打ち消す */
  box-shadow: none !important;        /* 内側の影を消す */
}



/* スポーツ通訳のメニュー */
.smia-layout--topmenu {
  display: block;
}

.smia-topmenu-wrap {
  margin: 0 0 18px;
}

.smia-local-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  padding: 10px 12px;
  background: #f7f8fa;
  border: 1px solid #ddd;
  border-radius: 10px;
  box-sizing: border-box;
}

.smia-local-menu a {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #d6d6d6;
  text-decoration: none;
  color: #333;
  white-space: nowrap;
  font-size: 13px;
  line-height: 1.4;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.smia-local-menu a:hover {
  background: #eef4ff;
  border-color: #b9cdf5;
}

.smia-main {
  min-width: 0;
}

@media (max-width: 767px) {
  .smia-topmenu-wrap {
    margin: 0 0 14px;
  }

  .smia-local-menu {
    gap: 6px 8px;
    padding: 8px 10px;
  }

  .smia-local-menu a {
    padding: 5px 10px;
    font-size: 12px;
  }
}


/* =========================================================
   MEISEI SCHOOL SKIN - CLEAN VERSION
   2026-09-18
   ========================================================= */

:root{
  --meisei-red:#df5b57;
  --meisei-red-dark:#c94c49;
  --meisei-red-soft:#fff0ed;
  --meisei-bg:#fffaf8;
  --meisei-card:#ffffff;
  --meisei-text:#332d2d;
  --meisei-muted:#6f6a68;
  --meisei-border:#eadfdb;
  --meisei-blue:#285d8f;
}

/* ---------- Global ---------- */

body{
  background:var(--meisei-bg);
  color:var(--meisei-text);
  font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",
    "Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
}

a{
  color:var(--meisei-blue);
  text-decoration:none;
}

a:hover{
  opacity:.82;
}

/* ---------- Standard header outside dashboard ---------- */

#header-container,
.header-container{
  background:#fff !important;
  color:var(--meisei-text) !important;
  border-bottom:1px solid var(--meisei-border);
}

#header,
.header,
#header-in{
  min-height:0 !important;
  height:auto !important;
}

#header-in{
  padding:16px 20px !important;
}

/* Hide inherited/broken logo image on ordinary pages */
.logo-header img,
#logo img{
  display:none !important;
}

/* Ordinary pages: simple school title */
.logo-header::after,
#logo::after{
  content:"明誠高等学校";
  display:block;
  text-align:center;
  color:var(--meisei-text);
  font-size:28px;
  font-weight:700;
  letter-spacing:.04em;
  line-height:1.4;
}

/* ---------- Navigation ---------- */

#navi,
.navi{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  background:#fff !important;
  border-top:1px solid #f4e7e3;
  border-bottom:1px solid var(--meisei-border);
}

#navi .navi-in > ul{
  display:flex !important;
  justify-content:center !important;
}

#navi .navi-in > ul > li > a,
#navi .navi-in > ul > li > a:visited,
#navi .navi-in > ul > li > a .item-label,
#navi .navi-in > ul > li > a span{
  color:#222 !important;
  font-weight:600 !important;
}

#navi .navi-in > ul > li > a{
  min-height:50px !important;
  padding:0 22px !important;
  font-size:14px !important;
}

#navi .navi-in > ul > li > a:hover,
#navi .navi-in > ul > li > a:hover .item-label,
#navi .navi-in > ul > li > a:hover span{
  color:var(--meisei-red-dark) !important;
  background:var(--meisei-red-soft) !important;
}

#navi .current-menu-item > a,
#navi .current-menu-parent > a{
  color:var(--meisei-red-dark) !important;
  background:var(--meisei-red-soft) !important;
}

/* ---------- General content ---------- */

#content{
  margin-top:22px;
}

.main,
.sidebar{
  background:transparent !important;
}

.main{
  border:0 !important;
}

.article{
  background:var(--meisei-card);
  border:1px solid var(--meisei-border);
  border-radius:16px;
  padding:28px 32px;
  box-shadow:0 8px 28px rgba(80,50,45,.055);
}

.entry-title{
  margin-bottom:28px;
  padding:14px 18px !important;
  border:0 !important;
  border-left:5px solid var(--meisei-red) !important;
  border-radius:0 8px 8px 0;
  background:#f8f3f1 !important;
  color:var(--meisei-text);
  font-size:26px;
  font-weight:700;
}

.logged-in .entry-title{
  display:none;
}

.logged-in .entry-content{
  margin-top:0 !important;
}

/* ---------- Sidebar ---------- */

.sidebar .widget{
  background:#fff;
  border:1px solid var(--meisei-border);
  border-radius:14px;
  padding:18px;
  margin-bottom:20px;
  box-shadow:0 5px 20px rgba(80,50,45,.04);
}

.sidebar .widget-title{
  background:transparent !important;
  border:0 !important;
  border-bottom:2px solid var(--meisei-red) !important;
  color:var(--meisei-text) !important;
  padding:0 0 10px !important;
  margin-bottom:12px;
  font-size:18px;
  letter-spacing:.04em;
}

.sidebar .widget li{
  margin:7px 0;
  line-height:1.65;
}

/* ---------- Forms ---------- */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
select,
textarea{
  background:#fff !important;
  border:1px solid #d9cfcb !important;
  border-radius:8px !important;
  padding:11px 13px !important;
  color:var(--meisei-text);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus{
  border-color:var(--meisei-red) !important;
  box-shadow:0 0 0 3px rgba(223,91,87,.12) !important;
  outline:none;
}

.um .um-button,
input[type="submit"],
button,
.button,
.btn{
  background:var(--meisei-red) !important;
  border:0 !important;
  border-radius:9px !important;
  color:#fff !important;
  font-weight:700;
  padding:11px 24px !important;
  box-shadow:0 5px 14px rgba(223,91,87,.18);
}

.um .um-button:hover,
input[type="submit"]:hover,
button:hover,
.button:hover,
.btn:hover{
  background:var(--meisei-red-dark) !important;
}

/* ---------- Admin-only box ---------- */

.aj-admin-only-box{
  background:#eef8ff;
  border:1px solid #c9e5f7;
  border-left:5px solid #69b6e5;
  border-radius:8px;
  padding:16px 20px;
  margin:18px 0;
}

/* =========================================================
   MEISEI DASHBOARD
   ========================================================= */

body:has(#meisei-dashboard-v2){
  background:#fffaf7 !important;
}

/* Keep the whole header container and navigation alive */
body:has(#meisei-dashboard-v2) #header-container,
body:has(#meisei-dashboard-v2) .header-container,
body:has(#meisei-dashboard-v2) #header-container-in,
body:has(#meisei-dashboard-v2) .header-container-in{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
  background:#fff !important;
}

/* Dashboard header: Meisei × Penn Foster */
body:has(#meisei-dashboard-v2) #header,
body:has(#meisei-dashboard-v2) .header{
  display:block !important;
  background:#fff !important;
  border:0 !important;
}

body:has(#meisei-dashboard-v2) #header-in{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:68px !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:8px 20px !important;
  box-sizing:border-box !important;
}

/* Hide normal header children except #logo, which becomes the × mark */
body:has(#meisei-dashboard-v2) #header-in > *:not(#logo){
  display:none !important;
}

body:has(#meisei-dashboard-v2) #header-in::before{
  content:"" !important;
  display:block !important;
  width:230px !important;
  height:52px !important;
  flex:0 0 230px !important;
  background:url("https://meisei.pf-japan.org/wp-content/uploads/2026/09/meisei-logo-1-1.png")
    center/contain no-repeat !important;
}

body:has(#meisei-dashboard-v2) #logo{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:34px !important;
  height:52px !important;
  flex:0 0 34px !important;
  margin:0 10px !important;
  padding:0 !important;
}

body:has(#meisei-dashboard-v2) #logo *{
  display:none !important;
}

body:has(#meisei-dashboard-v2) #logo::before{
  content:"×" !important;
  display:block !important;
  color:#b9aaa6 !important;
  font-size:18px !important;
  font-weight:400 !important;
  line-height:1 !important;
}

body:has(#meisei-dashboard-v2) #logo::after{
  content:none !important;
  display:none !important;
}

body:has(#meisei-dashboard-v2) #header-in::after{
  content:"" !important;
  display:block !important;
  width:145px !important;
  height:50px !important;
  flex:0 0 145px !important;
  background:url("https://meisei.pf-japan.org/wp-content/uploads/2026/09/PFlogo.png")
    center/contain no-repeat !important;
}

/* Dashboard navigation remains visible */
body:has(#meisei-dashboard-v2) #navi,
body:has(#meisei-dashboard-v2) .navi{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  background:#fff !important;
}

/* Remove Cocoon outer card/sidebar only on dashboard */
body:has(#meisei-dashboard-v2) #sidebar{
  display:none !important;
}

body:has(#meisei-dashboard-v2) .main{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body:has(#meisei-dashboard-v2) .article{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

body:has(#meisei-dashboard-v2) #content{
  max-width:1180px !important;
  margin:32px auto 60px !important;
  padding:0 20px !important;
  box-sizing:border-box !important;
}

body:has(#meisei-dashboard-v2) .entry-header,
body:has(#meisei-dashboard-v2) .entry-title{
  display:none !important;
}

body:has(#meisei-dashboard-v2) .entry-content{
  margin:0 !important;
}

/* Hide old Ultimate Member profile on dashboard */
body:has(#meisei-dashboard-v2) .um{
  display:none !important;
}

/* ---------- Dashboard frame ---------- */

#meisei-dashboard-v2{
  position:relative !important;
  max-width:1120px !important;
  margin:0 auto !important;
  padding:8px 0 60px !important;
  color:#282323;
}

/* ---------- Small account chip ---------- */

#meisei-dashboard-v2 .ms-account-chip{
  position:absolute !important;
  top:4px !important;
  right:6px !important;
  left:auto !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  width:auto !important;
  max-width:210px !important;
  margin:0 !important;
  padding:7px 10px !important;
  background:#fff !important;
  border:1px solid #eadeda !important;
  border-radius:12px !important;
  box-shadow:none !important;
  z-index:30 !important;
}

#meisei-dashboard-v2 .ms-account-icon{
  width:32px !important;
  height:32px !important;
  flex:0 0 32px !important;
}

#meisei-dashboard-v2 .ms-account-icon img{
  display:block !important;
  width:32px !important;
  height:32px !important;
  margin:0 !important;
  border-radius:50% !important;
}

#meisei-dashboard-v2 .ms-account-info{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.3 !important;
}

#meisei-dashboard-v2 .ms-account-info strong{
  color:#332d2d !important;
  font-size:11px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}

#meisei-dashboard-v2 .ms-account-info a{
  margin-top:2px !important;
  color:var(--meisei-red) !important;
  font-size:10px !important;
  text-decoration:none !important;
}

/* ---------- Welcome ---------- */

#meisei-dashboard-v2 .ms-welcome{
  min-height:100px !important;
  margin:0 0 26px !important;
  padding-right:230px !important;
}

#meisei-dashboard-v2 .ms-welcome .meisei-welcome{
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

#meisei-dashboard-v2 .ms-welcome .meisei-eyebrow{
  display:none !important;
}

#meisei-dashboard-v2 .ms-kicker{
  color:#e65b55 !important;
  font-size:11px !important;
  line-height:1.4 !important;
  font-weight:700 !important;
  letter-spacing:.07em !important;
}

#meisei-dashboard-v2 .ms-welcome h1{
  margin:7px 0 8px !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  font-size:36px !important;
  line-height:1.3 !important;
  font-weight:500 !important;
}

#meisei-dashboard-v2 .ms-welcome h1 span{
  color:#e65b55 !important;
}

#meisei-dashboard-v2 .ms-welcome p{
  margin:0 !important;
  color:#6d6663 !important;
  font-size:14px !important;
}

/* ---------- Penn Foster card ---------- */

#meisei-dashboard-v2 .ms-pf-card{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:0 0 32px !important;
  padding:20px 22px !important;
  background:#fffdfc !important;
  border:1px solid #efd8d2 !important;
  border-radius:16px !important;
}

#meisei-dashboard-v2 .ms-pf-left{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  min-width:0 !important;
}

#meisei-dashboard-v2 .ms-pf-logo{
  width:96px !important;
  min-width:96px !important;
  height:62px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  border:1px solid #efd3cc !important;
  border-radius:11px !important;
}

#meisei-dashboard-v2 .ms-pf-logo img{
  width:78px !important;
  max-width:78px !important;
  height:auto !important;
  max-height:48px !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
}

#meisei-dashboard-v2 .ms-pf-copy h2{
  color:#2d2928 !important;
  margin:4px 0 5px !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  font-size:19px !important;
  line-height:1.4 !important;
  font-weight:600 !important;
}

#meisei-dashboard-v2 .ms-pf-copy p{
  margin:0 !important;
  color:#6f6663 !important;
  font-size:12px !important;
}

/* ---------- Buttons ---------- */

#meisei-dashboard-v2 .ms-button{
  display:inline-block !important;
  flex-shrink:0 !important;
  padding:13px 21px !important;
  background:#e65b55 !important;
  color:#fff !important;
  border:0 !important;
  border-radius:9px !important;
  text-decoration:none !important;
  font-size:13px !important;
  font-weight:700 !important;
  box-shadow:0 7px 15px rgba(210,80,70,.15) !important;
}

#meisei-dashboard-v2 .ms-button:hover{
  background:#d94f49 !important;
}

/* ---------- AJ Support title ---------- */

#meisei-dashboard-v2 .ms-section-title{
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important;
  margin:0 0 12px !important;
}

#meisei-dashboard-v2 .ms-section-title span{
  color:#e65b55 !important;
  font-size:10px !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
}

#meisei-dashboard-v2 .ms-section-title strong{
  font-size:18px !important;
}

#meisei-dashboard-v2 .ms-section-title small{
  color:#8b817e !important;
  font-size:11px !important;
}

/* ---------- Support cards ---------- */

#meisei-dashboard-v2 .ms-support-grid{
  display:grid !important;
  grid-template-columns:minmax(0,2.15fr) minmax(270px,.9fr) !important;
  gap:18px !important;
}

#meisei-dashboard-v2 .ms-support-main,
#meisei-dashboard-v2 .ms-learning-card{
  padding:21px !important;
  background:#fff !important;
  border:1px solid #e3dfdd !important;
  border-radius:16px !important;
}

#meisei-dashboard-v2 .ms-support-main > h2,
#meisei-dashboard-v2 .ms-learning-card > h2,
#meisei-dashboard-v2 .ms-support-text h3{
  color:#292525 !important;
  background:none !important;
  border:0 !important;
}

#meisei-dashboard-v2 .ms-support-main > h2,
#meisei-dashboard-v2 .ms-learning-card > h2{
  margin:0 0 17px !important;
  padding:0 !important;
  font-size:17px !important;
  font-weight:700 !important;
}

#meisei-dashboard-v2 .ms-support-inner{
  display:grid !important;
  grid-template-columns:1.05fr 1.3fr !important;
  gap:22px !important;
  align-items:center !important;
}

#meisei-dashboard-v2 .ms-video{
  position:relative !important;
  width:100% !important;
  aspect-ratio:16/9 !important;
  box-sizing:border-box !important;
  padding:13px !important;
  background:#05090d !important;
  color:#fff !important;
  border-radius:10px !important;
  overflow:hidden !important;
  font-size:11px !important;
}

#meisei-dashboard-v2 .ms-video span{
  position:absolute !important;
  left:18px !important;
  bottom:15px !important;
  font-size:20px !important;
}

#meisei-dashboard-v2 .ms-support-text h3{
  margin:5px 0 9px !important;
  padding:0 !important;
  font-size:18px !important;
}

#meisei-dashboard-v2 .ms-support-text p{
  margin:0 0 16px !important;
  color:#756c69 !important;
  font-size:12px !important;
  line-height:1.8 !important;
}

#meisei-dashboard-v2 .ms-learning-row{
  display:flex !important;
  gap:11px !important;
  margin-bottom:15px !important;
}

#meisei-dashboard-v2 .ms-learning-row > b{
  width:23px !important;
  min-width:23px !important;
  height:23px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff0ed !important;
  color:#e65b55 !important;
  border-radius:50% !important;
  font-size:10px !important;
}

#meisei-dashboard-v2 .ms-learning-row strong{
  display:block !important;
  font-size:12px !important;
  line-height:1.4 !important;
}

#meisei-dashboard-v2 .ms-learning-row small{
  display:block !important;
  margin-top:2px !important;
  color:#8b817e !important;
  font-size:10px !important;
}

#meisei-dashboard-v2 .ms-more{
  color:#e65b55 !important;
  font-size:11px !important;
  font-weight:700 !important;
  text-decoration:none !important;
}

/* ---------- Mobile ---------- */

@media screen and (max-width:800px){

  #header-in{
    padding:12px !important;
  }

  .logo-header::after,
  #logo::after{
    font-size:22px;
  }

  body:has(#meisei-dashboard-v2) #header-in::before{
    width:170px !important;
    height:44px !important;
    flex-basis:170px !important;
  }

  body:has(#meisei-dashboard-v2) #header-in::after{
    width:105px !important;
    height:42px !important;
    flex-basis:105px !important;
  }

  body:has(#meisei-dashboard-v2) #logo{
    width:22px !important;
    flex-basis:22px !important;
    margin:0 5px !important;
  }

  #meisei-dashboard-v2{
    padding:0 0 40px !important;
  }

  #meisei-dashboard-v2 .ms-account-chip{
    position:static !important;
    width:fit-content !important;
    max-width:none !important;
    margin:0 0 15px auto !important;
  }

  #meisei-dashboard-v2 .ms-welcome{
    min-height:0 !important;
    padding-right:0 !important;
  }

  #meisei-dashboard-v2 .ms-welcome h1{
    font-size:27px !important;
  }

  #meisei-dashboard-v2 .ms-pf-card{
    display:block !important;
  }

  #meisei-dashboard-v2 .ms-pf-card .ms-button{
    margin-top:18px !important;
  }

  #meisei-dashboard-v2 .ms-support-grid,
  #meisei-dashboard-v2 .ms-support-inner{
    grid-template-columns:1fr !important;
  }

  #meisei-dashboard-v2 .ms-section-title{
    display:block !important;
  }

  #meisei-dashboard-v2 .ms-section-title strong,
  #meisei-dashboard-v2 .ms-section-title small{
    display:block !important;
    margin-top:4px !important;
  }

  .article{
    padding:20px 16px;
    border-radius:12px;
  }

  .entry-title{
    font-size:22px;
    padding:11px 13px !important;
  }

  input[type="text"],
  input[type="email"],
  input[type="password"],
  select,
  textarea{
    font-size:16px !important;
  }
}
/* =========================================================
   明誠TOP ヘッダー確定版
   ロゴ × Penn Foster ＋ メニューを残す
========================================================= */

/* 外枠を必ず表示 */
body:has(#meisei-dashboard-v2) #header-container,
body:has(#meisei-dashboard-v2) .header-container,
body:has(#meisei-dashboard-v2) #header-container-in,
body:has(#meisei-dashboard-v2) .header-container-in {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 0 !important;
    background: #fff !important;
    position: relative !important;
}

/* Cocoon本来のタイトル部分はいったん消す */
body:has(#meisei-dashboard-v2) #header,
body:has(#meisei-dashboard-v2) .header {
    display: none !important;
}

/* -----------------------------------------
   明誠 × Penn Foster ロゴ行
----------------------------------------- */

body:has(#meisei-dashboard-v2) #header-container::before {
    content: "" !important;
    display: block !important;

    height: 68px !important;

    background-image:
        url("https://meisei.pf-japan.org/wp-content/uploads/2026/09/meisei-logo-1-1.png"),
        url("https://meisei.pf-japan.org/wp-content/uploads/2026/09/PFlogo.png");

    background-repeat: no-repeat, no-repeat !important;

    background-position:
        calc(50% - 105px) center,
        calc(50% + 115px) center !important;

    background-size:
        190px auto,
        125px auto !important;
}

/* 真ん中の × */
body:has(#meisei-dashboard-v2) #header-container::after {
    content: "×" !important;

    position: absolute !important;
    top: 22px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    color: #b9aaa6 !important;
    font-size: 17px !important;
    line-height: 1 !important;

    pointer-events: none !important;
}


/* -----------------------------------------
   メニューを必ず復活
----------------------------------------- */

body:has(#meisei-dashboard-v2) #navi,
body:has(#meisei-dashboard-v2) .navi {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;

    background: #fff !important;

    border-top: 1px solid #f4e7e3 !important;
    border-bottom: 1px solid #eadeda !important;

    position: relative !important;
    z-index: 10 !important;
}
	
	
	
/* =========================================================
   MEISEI DASHBOARD v3
   Manus reference layout
========================================================= */

body:has(#meisei-dashboard-v3) {
    background: #fffaf7 !important;
}

/* Cocoonヘッダー・ナビ・サイドバーをTOPだけ使わない */
body:has(#meisei-dashboard-v3) #header-container,
body:has(#meisei-dashboard-v3) #navi,
body:has(#meisei-dashboard-v3) #sidebar {
    display: none !important;
}

body:has(#meisei-dashboard-v3) .main,
body:has(#meisei-dashboard-v3) .article {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body:has(#meisei-dashboard-v3) #content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body:has(#meisei-dashboard-v3) .entry-header,
body:has(#meisei-dashboard-v3) .entry-title {
    display: none !important;
}

body:has(#meisei-dashboard-v3) .entry-content {
    margin: 0 !important;
}


/* ==========================
   Header
========================== */

.ms3-header {
    background: #fff;
    border-bottom: 1px solid #eee2de;
}

.ms3-header-inner {
    max-width: 1160px;
    height: 68px;
    margin: auto;
    padding: 0 18px;

    display: grid;
    grid-template-columns: 285px 1fr 190px;
    align-items: center;
    gap: 20px;
}

.ms3-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ms3-brand img {
    display: block;
    width: auto;
    object-fit: contain;
}

.ms3-meisei-logo {
    max-width: 170px;
    max-height: 46px;
}

.ms3-pf-logo {
    max-width: 92px;
    max-height: 40px;
}

.ms3-brand-x {
    color: #baa9a5;
    font-size: 16px;
}


.ms3-nav {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: stretch;
}

.ms3-nav a {
    display: flex;
    align-items: center;

    padding: 0 13px;

    color: #5f5755 !important;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;

    border-bottom: 3px solid transparent;
}

.ms3-nav a:first-child {
    color: #e75c56 !important;
    border-bottom-color: #e75c56;
}


.ms3-account {
    display: flex;
    justify-content: flex-end;
}

/* shortcodeのfloatをこの場所では解除 */
.ms3-account .ms-account-chip {
    position: static !important;
    float: none !important;
    margin: 0 !important;
}


/* ==========================
   Main
========================== */

.ms3-main {
    max-width: 1120px;
    margin: 0 auto;
    padding: 38px 20px 70px;
}


/* Welcome */

.ms3-welcome {
    position: relative;
    min-height: 105px;
    margin-bottom: 22px;
    padding-right: 220px;
}

.ms3-welcome .meisei-welcome {
    margin: 0 !important;
    padding: 0 !important;
}

.ms3-welcome .meisei-eyebrow {
    display: none !important;
}

.ms3-kicker {
    color: #e75c56;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}

.ms3-welcome h1 {
    margin: 10px 0 8px !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;

    font-size: 34px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
}

.ms3-welcome h1 span {
    color: #e75c56 !important;
}

.ms3-welcome p {
    margin: 0 !important;
    color: #716966;
    font-size: 12px !important;
}

.ms3-pace {
    position: absolute;
    top: 50px;
    right: 0;

    padding: 11px 15px;

    color: #647b7e !important;
    background: #fff;
    border: 1px solid #d8e4e7;
    border-radius: 11px;

    font-size: 11px;
}

.ms3-pace strong {
    color: #b44f4a;
    font-size: 14px;
}


/* Penn Foster card */

.ms3-pf-card {
    min-height: 96px;
    margin-bottom: 33px;
    padding: 18px 20px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    background: #fffdfc;
    border: 1px solid #efd6cf;
    border-radius: 15px;
}

.ms3-pf-info {
    display: flex;
    align-items: center;
    gap: 16px;
}

.ms3-pf-icon {
    width: 90px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #fff;
    border: 1px solid #efd1ca;
    border-radius: 10px;
}

.ms3-pf-icon img {
    max-width: 72px;
    max-height: 42px;
}

.ms3-pf-card h2 {
    margin: 3px 0 3px !important;
    padding: 0 !important;

    color: #2d2928 !important;
    background: none !important;
    border: 0 !important;

    font-size: 17px !important;
    font-weight: 600 !important;
}

.ms3-pf-card p {
    margin: 0 !important;
    color: #766d69;
    font-size: 10px;
}


/* Buttons */

.ms3-red-button {
    display: inline-block;

    padding: 13px 19px;

    background: #e75b55;
    color: #fff !important;

    border-radius: 9px;

    font-size: 12px;
    font-weight: 700;

    box-shadow: 0 7px 16px rgba(210,75,70,.15);
}

.ms3-outline-button {
    display: inline-block;

    padding: 10px 14px;

    color: #b74e48 !important;
    background: #fff;

    border: 1px solid #b9d3e5;
    border-radius: 9px;

    font-size: 10px;
    font-weight: 700;
}


/* AJ Support heading */

.ms3-section-heading {
    margin-bottom: 11px;

    display: flex;
    align-items: baseline;
    gap: 8px;
}

.ms3-section-heading span {
    color: #e75c56;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.ms3-section-heading strong {
    font-size: 17px;
}

.ms3-section-heading small {
    color: #8c817e;
    font-size: 9px;
}


/* Top cards */

.ms3-support-grid {
    display: grid;
    grid-template-columns: minmax(0, 2.1fr) minmax(270px, .9fr);
    gap: 17px;

    margin-bottom: 27px;
}

.ms3-first-card,
.ms3-learning-card {
    background: #fff;
    border: 1px solid #dfe5e8;
    border-radius: 15px;
    padding: 19px;
}

.ms3-first-card h2,
.ms3-learning-card h2 {
    margin: 0 0 16px !important;
    padding: 0 !important;

    color: #2b2726 !important;
    background: none !important;
    border: 0 !important;

    font-size: 16px !important;
    font-weight: 700 !important;
}

.ms3-first-inner {
    display: grid;
    grid-template-columns: 1.15fr 1.25fr;
    gap: 20px;
    align-items: center;
}


/* Video placeholder */

.ms3-video-placeholder {
    position: relative;

    aspect-ratio: 16 / 9;
    padding: 11px;

    color: #fff;
    background: linear-gradient(#07518d, #071526);

    border-radius: 10px;
    overflow: hidden;

    font-size: 10px;
}

.ms3-placeholder-logo {
    position: absolute;
    left: 50%;
    top: 49%;

    transform: translate(-50%, -50%);

    font-size: 24px;
    font-weight: 700;
    line-height: .8;
}

.ms3-video-placeholder span {
    position: absolute;
    left: 16px;
    bottom: 13px;
}


.ms3-first-copy h3 {
    margin: 7px 0 10px !important;
    padding: 0 !important;

    color: #292525 !important;
    background: none !important;
    border: 0 !important;

    font-size: 18px !important;
}

.ms3-first-copy p {
    margin: 0 0 15px !important;
    color: #776d69;
    font-size: 11px;
    line-height: 1.7;
}


/* Learning card */

.ms3-learning-row {
    display: flex;
    gap: 10px;

    margin-bottom: 13px;
}

.ms3-learning-row > b {
    width: 22px;
    min-width: 22px;
    height: 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #e75b55;
    background: #fff0ec;

    border-radius: 50%;

    font-size: 9px;
}

.ms3-learning-row strong {
    display: block;
    font-size: 11px;
}

.ms3-learning-row small {
    display: block;
    margin-top: 2px;

    color: #8a817e;
    font-size: 9px;
}

.ms3-more {
    color: #e75b55 !important;
    font-size: 10px;
    font-weight: 700;
}


/* Orientation */

.ms3-orientation {
    display: grid;
    grid-template-columns: .85fr 1.25fr;
    gap: 45px;
    align-items: center;

    padding: 29px 0;

    border-top: 1px solid #eadfdb;
    border-bottom: 1px solid #eadfdb;
}

.ms3-tag {
    display: inline-block;

    margin: 10px 0 14px;
    padding: 6px 9px;

    color: #d85a53;
    background: #fff0ec;

    border-radius: 5px;

    font-size: 9px;
    font-weight: 700;
}

.ms3-orientation h2 {
    max-width: 430px;

    margin: 0 0 18px !important;
    padding: 0 !important;

    color: #292525 !important;
    background: none !important;
    border: 0 !important;

    font-size: 29px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
}

.ms3-duration {
    display: block;

    margin-bottom: 19px;

    color: #c45a54;
    font-size: 14px;
}

.ms3-orientation p {
    color: #756d69;
    font-size: 11px;
    line-height: 1.8;
}

.ms3-orientation-video {
    overflow: hidden;

    aspect-ratio: 16 / 9;

    background: #000;
    border-radius: 13px;
}

.ms3-orientation-video iframe {
    display: block;

    width: 100%;
    height: 100%;

    border: 0;
}


/* Main learning */

.ms3-main-learning {
    padding: 36px 0 22px;
}

.ms3-learning-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    margin-bottom: 15px;
}

.ms3-learning-head h2 {
    margin: 5px 0 0 !important;
    padding: 0 !important;

    color: #292525 !important;
    background: none !important;
    border: 0 !important;

    font-size: 21px !important;
    font-weight: 500 !important;
}

.ms3-learning-head > a {
    color: #e75b55 !important;
    font-size: 10px;
    font-weight: 700;
}


.ms3-course-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.ms3-course-card {
    min-height: 92px;

    padding: 18px 16px;

    display: grid;
    grid-template-columns: 44px 1fr 15px;
    gap: 12px;
    align-items: center;

    color: #302b2a !important;
    background: #fff;

    border: 1px solid #dbe6ed;
    border-radius: 14px;
}

.ms3-course-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #e65b55;
    background: #fff0eb;

    border-radius: 12px;

    font-size: 20px;
}

.ms3-course-icon.blue {
    color: #2e84ad;
    background: #e9f6fb;
}

.ms3-course-icon.orange {
    color: #c56843;
    background: #fff1e8;
}

.ms3-course-card strong {
    display: block;
    font-size: 12px;
}

.ms3-course-card small {
    display: block;

    margin-top: 5px;

    color: #788087;
    font-size: 9px;
    line-height: 1.5;
}

.ms3-course-card > b {
    color: #7891a4;
    font-size: 18px;
}


/* Bottom */

.ms3-bottom-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;

    margin-top: 5px;
}

.ms3-bottom-card {
    padding: 21px;

    background: #fff;
    border: 1px solid #dbe6ed;
    border-radius: 14px;
}

.ms3-bottom-title {
    display: flex;
    justify-content: space-between;
    align-items: center;

    margin: 6px 0 14px;
}

.ms3-bottom-title h2 {
    margin: 0 !important;
    padding: 0 !important;

    color: #292525 !important;
    background: none !important;
    border: 0 !important;

    font-size: 18px !important;
    font-weight: 500 !important;
}

.ms3-bottom-title a {
    color: #e65b55 !important;
    font-size: 10px;
    font-weight: 700;
}


.ms3-mini-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.ms3-mini-grid a {
    padding: 13px;

    color: #302b2a !important;
    background: #fff;

    border: 1px solid #dbe6ed;
    border-radius: 10px;
}

.ms3-mini-grid strong {
    display: block;
    font-size: 10px;
}

.ms3-mini-grid span {
    display: block;
    margin-top: 5px;

    color: #77818a;
    font-size: 8px;
}


.ms3-support-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.ms3-support-links a {
    color: #302b2a !important;
}

.ms3-support-links b {
    display: block;

    margin-bottom: 5px;

    color: #e65b55;
    font-size: 20px;
}

.ms3-support-links strong {
    display: block;
    font-size: 10px;
}

.ms3-support-links span {
    display: block;
    margin-top: 4px;

    color: #7d848a;
    font-size: 8px;
}


/* Mobile */

@media screen and (max-width: 900px) {

    .ms3-header-inner {
        height: auto;
        padding: 10px 14px;

        grid-template-columns: 1fr auto;
    }

    .ms3-nav {
        order: 3;
        grid-column: 1 / -1;

        overflow-x: auto;

        margin-top: 8px;
    }

    .ms3-nav a {
        min-height: 40px;
    }

    .ms3-main {
        padding: 25px 14px 50px;
    }

    .ms3-welcome {
        padding-right: 0;
    }

    .ms3-pace {
        position: static;
        display: inline-block;
        margin-top: 15px;
    }

    .ms3-support-grid,
    .ms3-orientation,
    .ms3-bottom-grid {
        grid-template-columns: 1fr;
    }

    .ms3-course-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 600px) {

    .ms3-brand {
        gap: 6px;
    }

    .ms3-meisei-logo {
        max-width: 130px;
    }

    .ms3-pf-logo {
        max-width: 70px;
    }

    .ms3-account {
        display: none;
    }

    .ms3-first-inner,
    .ms3-course-grid,
    .ms3-mini-grid {
        grid-template-columns: 1fr;
    }

    .ms3-pf-card {
        display: block;
    }

    .ms3-pf-card .ms3-red-button {
        margin-top: 15px;
    }

    .ms3-welcome h1 {
        font-size: 27px !important;
    }
}